padding
padding是指元素的內(nèi)邊距，元素距離盒子邊框的距離懈贺。
padding屬性
padding-toppadding-rightpadding-bottompadding-left
屬性的取值：
- length - px, pt, cm, etc.
- % - 設(shè)置為外框?qū)挾鹊?
- inherit - 設(shè)置為跟父元素一樣的值
設(shè)置方法
div {
padding-top: 50px;
padding-right: 30px;
padding-bottom: 50px;
padding-left: 80px;
}
簡(jiǎn)寫：
div {
padding: 25px 50px 75px 100px;
}
如果padding屬性設(shè)為3個(gè)值：
- padding: 25px 50px 75px;
- top padding is 25px
- right and left paddings are 50px
- bottom padding is 75px
如果padding屬性設(shè)為2個(gè)值：
- padding: 25px 50px;
- top and bottom paddings are 25px
- right and left paddings are 50px
如果padding屬性設(shè)為1個(gè)值：
- padding: 25px;
- all four paddings are 25px
Padding和元素寬度
如果指定了padding屬性，元素的實(shí)際寬度需要把padding考慮進(jìn)去碰逸。
div {
width: 300px;
padding: 25px;
}
此時(shí)div的寬度為：300px + 25px + 25px.
如果仍想保持寬度為300px，則需要設(shè)置box-sizing屬性：
div {
width: 300px;
padding: 25px;
box-sizing: border-box;
}
