HTML表格
2018-06-06 本文已影响14人
Mustard_Buli
<table>
标记
-
基本格式
<table 属性1="属性值1" 属性2="属性值2"......>表格内容</table>
-
table标记的属性
-
width
(宽度) -
height
(高度) -
border
(边框) -
align
表格的对齐方式:
- left (居左)
- center (居中)
- right (居右)
-
cellspacing
(单元格与单元格之间的距离) -
cellpadding
(单元格与内容之间的距离) -
frame
- void (无边框)
- above (仅顶部)
- below (仅底部)
- hsides (仅顶部和底部)
- lhs (仅左侧)
- rhs (仅右侧)
- vsides (仅左侧和右侧)
- box (全部4个)
- border (全部4个)
-
rules
-
作用
控制是否显示以及如何显示单元格之间的分割线
-
属性值
- none (默认值,无分割线)
- all (所有分割线)
- rows (仅有行分割线)
- clos (仅有列分割线)
- groups (仅有行组和列组之间有分割线)
-
-
<caption>
标记
-
什么时候使用
如果表格需要标题,则使用该标记
-
如何使用正确
<caption>
属性的插入位置,直接位于<table>
属性之后,<tr>
表格行之前。 -
align
属性-
top
(标题放在表格的上部) -
bottom
(标题放在表格的下部) -
left
(标题放在表格的左侧) -
right
(标题放在表格的右侧)
-
<tr>
标记
-
定义
定义表格的一行,每一行都是一对
<tr>...</tr>
标记表示,每一行<tr>
标记可以嵌套多个<td>
或者<th>
标记。 -
可选属性
-
bgcolor
(背景颜色) -
valign
(垂直方向对齐方式:bottom
、top
、middle
) -
align
(水平方向对齐方式:left
、right
、center
)
-
<td>
和<th>
标记
-
定义
<td>
和<th>
都是单元格的标记,其必须嵌套在<tr>
标签内,是成对出现的。 -
两者的区别
-
<th>
是表头标记,通常位于首行或首列,<th>
中的文字默认会被加粗,而<tr>
不会 -
<td>
是数据标记,表示该单元格的具体数据
-
-
共同点
两者的标记属性是一致的
-
属性
-
bgcolor
(背景颜色) -
align
(对齐方式) -
valign
(垂直对齐方式) -
width
(宽度) -
height
(高度) -
rowspan
(所占行数) -
colspan
(所占列数``)
-