一.padding--内边距
1.padding和margin属性值上差别在于没有auto选项，二者都有单边赋值xx-top｜right｜bottom｜left。
2.padding是有颜色的，background-color将填充所有border以内的区域
3.如果是两个值，则第一个值表示上下、第二个表示左右；
如果是三个值，则第一个表示上，第二个是左右，第三个是下；
如果是四个值，按顺时针赋值
4.一般不设置宽，用padding撑开盒子，更适合开发。注意0PX也是有意义的
二、padding不额外撑开盒子的情况
大div盒子包一个小div盒子，因为宽度不给予的情况下，默认和父亲一样宽，所以在只设高度的情况下，添加padding/border，只撑开了高，没有撑开宽度。但如果padding值超过了父亲宽度，则依旧会超过父盒子。所以通栏的盒子一般不写宽度
<style>
.box{
width:200px;
height:200px;
background-color:pink;
}
.box1{
background-color:red;
padding:10px;
}
</style>
</head>
<body>
<div class="box">
<div class="box1"></div>
</div>
</body>
三.清除默认padding
<!--一些元素，默认带有padding-->
<style>
* {
margin: 0;
padding: 0;
}
</style>
网友评论