表格技术初涉
表格:是指将一点范围的区域分为“行列对齐”的若干个“格子”的一种技术。
表格使用如下3个标签搭配以形成完整的表格基本表现:
<table>
<tr>
<td>这个td中才是放置具体“内容部分”的区域</td>
</tr>
</table>
table:用于“声明”一个表格
tr:用于设定一个表格中的“一行”,多个就使用多个tr配对。
td:用于设定一个行中的“一行”(单元格),多个列就使用多个td。
一个表格可以有多行,一个行可以有多列。
表格中的单元格的“合并”操作是通过td上的两个属性来实现。
table常用属性:
width:
height:
border:设定表格的边框线,其实会应用整个表格的所有“边框线”(每个单元格)
cellpadding:设定单元格中的内容与单元格的边框线之间的“间距”,单位是px
cellspacing:设定相邻的两个单元格的边框线之间的“间距”,单位是px
bgcolor="blue"设定表格的背景颜色
align="left//center//right":设定表格总体的定位方式
background="图片地址url":设定表格的总体上的背景图
td常用属性:
width
height
bgcolor="biue"设定单元格的背景颜色
background="图片地址url":设定单元格的背景图
align="left//center//right":设定单元格中的内容的水平对齐方式
ralign="top//middle//bottom":设定单元格中的内容的垂直对齐方式
colspan="5":表示该单元格会水平向右边合并5个”原始单元格“,其本身相当于”跨“5列
rowspan="3":表示该单元格会垂直向下边合并3个”原始单元格“,其本身相当于”跨“3个行
表格深入
td用于设定一个普通单元格
th用于设定一个”标题单元格“:其中的文字会自动粗细并居中——凡是可以用td就可以用th
在table中使用caption标签,其中可设定标题文字
实际上,作为表格”table“,其内部的所有行还可以进一步进行”表格区域化“,通常有3种形式的表格区域:
thead:代表表格的”头部“区域,其中可以放置tr(及其下属)标签
tbody:代表表格的”中部“区域(主体区域),同样可以放tr--所有设有明确使用分区标签。归到某个区域的tr标签,都自动隶属于tbody分区。--也就是说,tbody有可能自动出现。
tfoot:代表表格的”尾部“区域”,同样可以放tr.