是不是表单属性和一些Css样式存在不兼容问题 只要添加了padding和margin就会出问题
来源：4-1 课程总结
前端工程师Var
2018-07-02 09:09:02
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>每日练习</title>
<style>
*{
margin:0;
padding:0;
}
</style>
</head>
<body>
<!--创建2行3列表格 -->
<table border="6" width="500px" bgcolor="#f2f2f2" cellspacing="0" cellpadding="5px" >
<caption> 前端工程师平均工资</caption>
<thead>
<tr bgcolor="#d8e4bc">
<th rowspan="2">城市</th>
<th colspan="2">2014年</th>
<th rowspan="2">2015年</th>
<th rowspan="2">2016年</th>
</tr>
<tr bgcolor="#d8e4bc">
<th>上半年</th>
<th>下半年</th>
</tr>
</thead>
<tbody valign="middle">
<tr>
<td bgcolor="#b8cce4" valign="middle">北京</td>
<td>8000</td>
<td>9000</td>
<td>10000</td>
<td>12000</td>
</tr>
<tr>
<td bgcolor="#b8cce4" valign="middle">上海</td>
<td>6000</td>
<td>7000</td>
<td>8000</td>
<td>10000</td>
</tr>
</tbody>
<tfoot>
<tr valign="middle">
<td height="30px" bgcolor="#b8cce4">合计</td>
<td>7000</td>
<td>8000</td>
<td>9000</td>
<td>11000</td>
</tr>
</tfoot>
</table>
<!-- Js导入区 -->
<script src="js/jquery-1.12.4.js"></script>
<script src="js/index.js"></script>
</body>
</html>
1回答
-
因为表格的特殊性。
table tr 的padding css 属性设置无效
tr td 的 margin css 属性设置无效可以使用表格的cellspacing、cellpadding 属性实现效果.
1
相似问题