关于padding
1,959 阅读
<style type="text/css" media="screen">
/*padding区域是有颜色的 brackground-color来填充padding里面的颜色*/
div{
background-color: blue;
}
/*padding是四个方向的,我们可以分别描述四个方向的padding*/
/*①分*/
div{
width: 200px;
height:200px;
padding-left: 20px;
padding-right: 20px;
padding-top: 30px;
padding-bottom: 40px;
border: 1px solid red;
} /*这种就是复合属性 如果不写就代表没有*/
/*②综合属性 空格隔开 上右下左*/
div{
width: 200px;
height: 200px;
border:1px solid red;
padding:30px 20px 40px 20px；
}/*分别代表上 右 下 左*/
/*如果只写三个值 综合顺序仍然是上右下左 但是因为没有左边值
一般会和右一样 如果写两个值那么下和左则和上右一样 一个值就是默认的正方形*/
/*这个盒模型还有一种表示方法 用小属性层叠大属性*/
div{
width: 200px;
height: 200px;
border: 1px solid red;
padding: 20px;
padding-top: 30px;
padding-bottom: 40px;
} /*当然要注意顺序 不能把小属性写在大属性前面*/
</style>
</head>
<body>
<div>
内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内
</div>
</body>
