1、table标签
块元素
tr表示表格中的一行,有几个tr就有几行
td表示一个单元格,有几个td就有几个单元格
rowspan 纵向合并单元格
colspan 横向合并单元格
举例:三行两列表格
<table> <tr> <td>A1</td> <td rowspan="2">B1</td> </tr> <tr> <td>A2</td> </tr> <tr> <td colspan="2">A3</td> </tr> </table>
2、长表格
可以将一个表格分成三个部分:
头部 thead
主体 tbody
底部 tfoot
th表示头部的单元格,加粗居中效果
3、表格样式
border-spacing 指定边框之间的距离
border-collapse:collapse;设置边框的合并
/*设置表格偶数行背景*/
tbody>tr:nth-child(even/2n){ background-color:#bfa }
如果表格中没有使用tbody而直接使用tr,那么浏览器会自动创建一个tbody,并且将tr全都放到tbody中,tr不是table的子元素。
默认情况下元素在td中是垂直居中的,可以通过vertical-align来修改
将box1水平垂直居中于box2的方法
display:table-cell;/*将元素设置为单元格*/
margin:0 auto;
vertical-align:middle;