简写背景属性
background:颜色 图片路径 居中 不重复 固定 (没有 顺序和数量要求 没设置的就使用默认值)
执行下边的 background写下边 会给上边的background-color 覆盖
网页中设计表格
th 表头便签 居中 加粗
tr 行 不是table的直接后代 是孙子
td 列
style type=text/css
table{
margin:0 auto;
width:300px;
barder:1px slid black;
border-spacing:0px; 没有间距 一条线 两像素 合并
border-collapse:collapse;一像素 只留td边框 边框合并 td的边框就失效了 没有意义了
}
th,td{
border:1px solid black
} 都给设上
表格的标签
<table>
<tr> 代表行
<td >代表列A1</td>
<td rowspan=2>A2</td>纵向合并2个
</tr>
</table>
设置背景
ie8不支持 需要兼容的 ie9以上的都支持
给奇数行的设置颜色 even偶数c
tr:nth-child(odd){
background-color:#f5f5f5
}
鼠标移入变颜色
ie6不好使 ie9以上的都支持
tr:hover{
background-color:yellow
}
长表格 表头 主体 底部
<table>
<thead>
<tr>
<th>薪资</th>
</tr>
<thead>
<tbody>
<tr>
<td>80000</td>
</tr>
<tbody>
<tfoot>
<tr
<td></td>
<td></td>
<td>剩余</td>
<tr>
<tfoot>
<table>
设置宽高
<table border="1" width="100%">
<tr height="100px">
<td></td>
</tr>
<tr height="500px">
<td></td>
</tr>
<tr height="100px">
<td></td>
</tr>
</table>
表格可以嵌套的
td 里可以在加表格的 可以一给嵌套的表格在设置宽 高
完善
父子元素重叠 外边距重叠
.box1:before{
content:" ";
display:table;
clear:both;
}
高度塌陷
.clearfix:after{
content:" ";
display:table;
clear:both;
}
网友评论