HTML基础（四）表格

HTML基础（四）表格

定义和用法

简单的 HTML 表格由 table 元素以及一个或多个 tr、th 或 td 元素组成。

tr 元素定义表格行，th 元素定义表头，td 元素定义表格单元。

更复杂的 HTML 表格也可能包括 caption、col、colgroup、thead、tfoot 以及 tbody 元素。

创建一个两行三列的表格

View Code

如果要给表格加上边框，就要在table标签里加上border属性

View Code

这样就给表格加上了1像素的边框

带表头的表格

…

带标题的表格，要放在table标签的下面，

一个表格只能定义一个标题

带结构的表格

不影响布局，但是当表格比较多的时候，不用等到所有表格加载完才显示，会分块显示

表格划分三部分：表头、主体、脚注• thead：表格的头 （放标题之类内容）• tbody：表格的主体 （放数据本体）• tfoot：表格的脚 （放表格的脚注）

表格属性

table的属性

table标签除了具有html元素中通用的属性外，还含有自己的属性，常用属性如下：bgcolor：规定表格边框的宽度。cellpadding：规定单元边沿与其内容之间的空白，一个单元格的大小cellspacing：规定单元格之间的空白。frame：规定外侧边框的哪个部分是可见的。rules：规定内侧边框的哪个部分是可见的。summary：规定表格的摘要。width：规定表格的宽度。

frame属性

void 不显示外侧边框。above 显示上部的外侧边框。below 显示下部的外侧边框。hsides 显示上部和下部的外侧边框。vsides 显示左边和右边的外侧边框。lhs 显示左边的外侧边框。rhs 显示右边的外侧边框。box 在所有四个边上显示外侧边框。border 在所有四个边上显示外侧边框

rules属性

none 没有线条。groups 位于行组和列组之间的线条。rows 位于行之间的线条。cols 位于列之间的线条。all 位于行和列之间的线条。

tr标签属性

td和th标签属性

、和标签属性

跨列属性colspan

View Code

合并

跨行属性rowspan

表格嵌套

小练习

完成以下表格样式

View Code

版权声明：本文内容由网络用户投稿，版权归原作者所有，本站不拥有其著作权，亦不承担相应法律责任。如果您发现本站中有涉嫌抄袭或描述失实的内容，请联系我们jiasou666@gmail.com 处理，核实后本网站将在24小时内删除侵权内容。