盒子的高度比较大，所以设置填充padding为20px时，他只有上填充和左填充满足了吗？
请问这个有什么规律呢？他优先满足了上填充和左填充为20px吗？为何不是满足右填充和下填充距离为20px呢？
Michael_O_O_
2015-01-08
3 回答
如果还不明白把这段代码贴到编辑器内，看看效果你就明白了。
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>填充</title>
<style type="text/css">
#box1{
width:60px; /*注意此时盒子的宽度应该是102px，加上左右填充20px，左右各1px边框*/
height:60px; /*注意此时盒子的高度应该是102px，加上上下填充20px上下各1px边框*/
padding:20px;/*给盒子上右下左的填充各添加20px */
border:1px solid red;/*给盒子上右下左都加上1px的红色实心边框 */
}
#box2{
width:60px;
height:60px;
background:#CCC;
}
</style>
</head>
<body>
<div id="box1">
<div id="box2">盒子1</div>
</div>
</body>
</html>
举报
0/150
提交
取消
