美文网首页
web学习HTML2：表格

web学习HTML2：表格

作者: TDB | 来源:发表于2019-04-27 07:56 被阅读0次

1.表格

     <table border="1"> // 表格
         <caption> 前端工程师平均工资</caption>//表格标题，居中显示
         <tr>// 行
            <th>2014年</th>//表格头，内容居中、加粗显示
            <td>2015年</td>//单元格
            <td>2016年</td>
         </tr>
         <tr>
            <td>8000</td>
            <td>10000</td>
            <td>12000</td>          
         </tr>
     </table>

2.解决逐步加载用带结构的表格

thead、tbody、tfoot

3.<table>表格属性

表格属性 
bgcolor="#f2f2f2"
align="center"
外边框 内边框

4.<tr>行属性

行属性
颜色属性 
bgcolor="red"
bgcolor="rgb(20,20,39)"
bgcolor="#d8e3bc"
align="center" // 水平居中
valign="middle" //  垂直居中

5.表格跨行列colspan

colspan 跨列 后删除其他单元格
rowspan 跨行 后删除其他单元格
<th rowspan="2">城市</th>
<th colspan="2">2014年</th>

6.表格嵌套只能在td单元格中嵌套完整的表格

7.表格布局

注：
1.表格网页布局时，不设置border边框，只是作为网页结构的排版
2.尽量少的使用表格嵌套
3.尽量少的使用跨行跨列

相关文章