码迷,mamicode.com
首页 > Web开发 > 详细

CSS属性之表格(Table)

时间:2014-12-27 16:11:11      阅读:610      评论:0      收藏:0      [点我收藏+]

标签:table   表格   表格样式   css table   

CSS属性之表格(Table)

HTML为表格定义了3个元素用于对行进行分组,它们是 thead (表头)、tbody (表格主体)、tfoot (脚注)。

在HTML4中文档结构中的 tfoot 必须出现在 tbody之前,HTML5去掉了这个限制。

如果在源代码中没有写分组元素时,浏览器会自动创建 tbody ,所以选择器 table > tr 总是无效,因为中间有 tbody。

如果表格主体中的每一行都是以 td 元素开头,那这些 th 就是行标题。


colgroup 与 col

<colgroup> 标签只能在 table 元素中使用。

<col> 标签只能在 table 或 colgroup 元素中使用。

col 可以在 colgroup 之外使用。

colgroup 中的 col 会覆盖 colgroup 样式。


技术分享

table-layout:auto | fixed

auto: 默认的自动算法。布局将基于各单元格的内容,换言之,可能你给某个单元格定义宽度为100px,但结果可能并不是100px。表格在每一单元格读取计算之后才会显示出来,速度很慢。

fixed: 固定布局的算法。在这算法中,水平布局是仅仅基于表格的宽度,表格边框的宽度,单元格间距,列的宽度,而和表格内容无关。也就是说,内容可能被裁切。


border-collapse:separate | collapse

separate: 边框独立。

collapse: 相邻边被合并。

只有当表格边框独立(即border-collapse属性等于separate时),border-spacing和empty-cells才起作用。


border-spacing:<length>{1,2}

用长度值来定义行和单元格的边框在横向和纵向上的间距。不允许负值。

如果提供全部两个length值时,第一个作用于横向间距,第二个作用于纵向间距。 

如果只提供一个length值时,这个值将作用于横向和纵向上的间距。 


caption-side:top | bottom

top: 指定caption在表格上边。

bottom: 指定caption在表格下边。


empty-cells:hide | show

设置或检索当表格的单元格无内容时,是否显示该单元格的边框。

hide: 指定当表格的单元格无内容时,隐藏该单元格的边框。 

show: 指定当表格的单元格无内容时,显示该单元格的边框。


CSS属性之表格(Table)

标签:table   表格   表格样式   css table   

原文地址:http://blog.csdn.net/wozaixiaoximen/article/details/42193197

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!