❮ HTML Picture 图像元素
HTML 列表 ❯
HTML 表格
更新于 2024/9/26 23:26:00
HTML 表格允许 web 开发人员将数据排列成行和列。
实例
Company
Contact
Country
Alfreds Futterkiste
Maria Anders
Germany
Centro comercial Moctezuma
Francisco Chang
Mexico
Ernst Handel
Roland Mendel
Austria
Island Trading
Helen Bennett
UK
Laughing Bacchus Winecellars
Yoshi Tannamuri
Canada
Magazzini Alimentari Riuniti
Giovanni Rovelli
Italy
亲自试一试 »
HTML 表格
表格由
| 标签定义。
每行被分割为若干单元格，由 | 标签定义。
实例 一个简单的 HTML 表格:
亲自试一试 » 注释: | 元素是表的数据容器。 它可以包含各种 HTML 元素；文本、图像、列表、其他表等。
HTML 表格 - 边框 要向表中添加边框，请使用 CSS border 属性: 实例 table, th, td { border: 1px solid black; } 亲自试一试 » 记住为表格和表格单元格定义边框。 HTML 表格 - 边框折叠 设置表格边框是折叠为单一边框还是分开的，使用 CSS border-collapse 属性: 实例 table, th, td { border: 1px solid black; border-collapse: collapse;} 亲自试一试 » HTML 表格 - 填充 填充指定单元格内容与其边框之间的间距。 如果不指定填充，则将显示不带填充的表格单元格。 要设置填充，请使用 CSS padding 属性: 实例 th, td { padding: 15px;} 亲自试一试 » HTML 表格 - 左对齐标题 默认情况下，表格标题为粗体且居中。 要左对齐表格标题，请使用 CSS text-align 属性: 实例 th { text-align: left;} 亲自试一试 » HTML 表格 - 边框间距 边框间距指定单元格之间的间距。 要设置表格的边框间距，请使用 CSS border-spacing 属性: 实例 table { border-spacing: 5px;} 亲自试一试 » 注释: 如果表格具有折叠边框，则 border-spacing 无效。 HTML 表格 - 跨多列的单元格 要使单元格跨越多个列，请使用 colspan 属性: 实例
亲自试一试 » HTML 表格 - 跨多行的单元格 要使单元格跨多行，请使用 rowspan 属性: 实例
亲自试一试 » HTML 表格 - 标题 要向表中添加标题，请使用 实例
亲自试一试 » 注释:
现在，您可以为此表定义特殊样式: #t01 { width: 100%; background-color: #f1f1c1;} 亲自试一试 » 并添加更多样式: #t01 tr:nth-child(even) { background-color: #eee;} #t01 tr:nth-child(odd) { background-color: #fff;} #t01 th { color: white; background-color: black;} 亲自试一试 » 本章小结 使用 HTML
| ||||||||||||||||||||||||||||||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|