CSS中的內(nèi)邊距(padding)是指元素邊框與元素內(nèi)容之間的空白區(qū)域。在CSS中,我們可以通過使用padding屬性來設(shè)置元素的內(nèi)邊距。
例子: div { padding: 20px; }
上述代碼將會給div元素設(shè)置一個20像素的內(nèi)邊距。我們也可以分別設(shè)置不同方向上的內(nèi)邊距:
例子: div { padding-top: 10px; padding-bottom: 15px; padding-left: 5px; padding-right: 7px; }
上述代碼將會給div元素設(shè)置一個10像素的上內(nèi)邊距,15像素的下內(nèi)邊距,5像素的左內(nèi)邊距,7像素的右內(nèi)邊距。
當(dāng)使用百分比值來設(shè)置內(nèi)邊距時,它是以元素的寬度為參考的:
例子: div { padding: 10% 5%; }
上述代碼將會給div元素設(shè)置一個10%的上下內(nèi)邊距和5%的左右內(nèi)邊距。
注意:當(dāng)元素的內(nèi)容沒有填滿元素的空間時,內(nèi)邊距將會讓元素更加寬敞,這時可以使用box-sizing屬性將元素的盒模型設(shè)置為border-box,這樣內(nèi)邊距的大小不會使元素變寬。
例子: div { box-sizing: border-box; padding: 20px; }
上述代碼將會將邊框和內(nèi)邊距的大小考慮進(jìn)元素的寬度中,使元素的寬度不會因為邊框和內(nèi)邊距的大小而發(fā)生變化。
下一篇java求階乘累和