【网站设计】使用CSS处理表格边框样式化

在以前的web开发栏目中,我介绍了不少处理html表格的方法,尽管现在使用表格来布局网页的方法已经不再时髦了,但是您依然可以使用表格来显示表列数据。
显示和样式化表格的方法有很多种,在这篇文章中,我将介绍使用CSS对表格边框进行样式化的方法。
链接
CSS2表格模型是基于HTML 4.01表格模型的。表格包含了一个可选的锚标记和单元格以及数据行,表格模型包含以下的元素:表格、锚、数据行、数据行组、数据列、数据列组和单元格。这篇文章将集中讲解表格中各个元素的边框处理方法。
边框
根据不同的需求,您可以对表格和单元格应用不同的边框。您可以定义整个表格的边框也可以对单独的单元格分别进行定义。CSS的边框属性可以指定边框的大小以及颜色和类型。以下的代码定义了宽度为5个像素的黑色实线边框:
TABLE { 5px solid black; }
除此以外,您还可以使用相同的语法为表格中单独的单元格分别指定边框属性。您可以使用以下的属性值来定义边框类型:
l none: 指定表格没有边框,所以边框宽度为0。
l dotted: 由点线组成的表格边框。
l dashed: 由虚线组成的表格边框。
l solid: 由实线组成的表格边框。
l Double: 由双实线组成的表格边框。
l Groove: 槽线效果边框。
l ridge: 脊线效果边框,和槽线效果相反。
l inset: 内凹效果边框。
l outset: 外凸效果边框,和内凹效果相反。

本文固定链接: http://www.ioedo.com/236.html | 网页设计师交流网_edo欧晓峰博客_网页设计师一枚_专注于网页设计

该日志由 admin 于2013年02月06日发表在 Dreamweaver, 设计教程 分类下, 你可以发表评论,并在保留原文地址及作者的情况下引用到你的网站或博客。
原创文章转载请注明: 【网站设计】使用CSS处理表格边框样式化 | 网页设计师交流网_edo欧晓峰博客_网页设计师一枚_专注于网页设计
关键字: , ,

【网站设计】使用CSS处理表格边框样式化:目前有1 条留言

  1. 沙发
    Edison:

    哈哈

    2013-02-06 23:20 [回复]

发表评论


快捷键:Ctrl+Enter