默認(rèn)情況下,在每個(gè)塊中內(nèi)容的內(nèi)邊距都是為 0 的,我們可以通過 padding 屬性為其設(shè)置內(nèi)邊距。
屬性值為 數(shù)字 加 單位像素(px)
padding-top 代表距上內(nèi)邊距,我們?yōu)槠湓O(shè)置值之后,塊中的內(nèi)容距離上邊框的距離就等于 padding-top 的屬性值。
padding-right 代表距右內(nèi)邊距,為其設(shè)置值之后,塊中的內(nèi)容距離右邊框的距離就等于 padding-right 的屬性值。
padding-bottom 代表距下內(nèi)邊距,為其設(shè)置值之后,塊中的內(nèi)容距離下邊框的距離就等于 padding-bottom 的屬性值。
padding-left 代表距左內(nèi)邊距,為其設(shè)置值之后,塊中的內(nèi)容距離左邊框的距離就等于 padding-left 的屬性值。
直接使用 padding 也可以設(shè)置內(nèi)邊框,有多種取值方式。
利用四個(gè)屬性值的表示方法,代表著按照順時(shí)針方向設(shè)置四個(gè)方向的內(nèi)邊距,即第一個(gè)代表距上邊內(nèi)邊距,第二個(gè)代表距右邊內(nèi)邊距,第三個(gè)代表距下邊內(nèi)邊距,第四即距左邊內(nèi)邊距。格式為 padding:top right bottom left;
利用三個(gè)屬性值的表示方法,代表著按照順時(shí)針方向設(shè)置三個(gè)方向的內(nèi)邊距,跟四個(gè)屬性值時(shí)前三個(gè)的表示相同,第四個(gè)(即距左邊內(nèi)邊距)省略掉,這個(gè)時(shí)候距左邊內(nèi)邊距的屬性值將等于距離右邊內(nèi)邊距的屬性值。格式為 padding:top right bottom;
利用兩個(gè)屬性值的表示方法,第一個(gè)屬性值代表著距上邊的內(nèi)邊距,第二個(gè)屬性值帶擺著距右邊的內(nèi)邊距。這里的距下內(nèi)邊距和距左內(nèi)邊距都有對應(yīng)的屬性值,距下邊內(nèi)邊距的屬性值等于距上邊內(nèi)邊距,距左內(nèi)邊距的屬性值等于距右內(nèi)邊距的屬性值。格式為 padding:top right;
直接利用單個(gè)屬性值的表示方法,代表著四個(gè)方向的內(nèi)邊距都相同。
如果塊中的空間已被內(nèi)容填滿,添加內(nèi)邊距將會撐大塊的體積,為塊添加背景顏色時(shí),內(nèi)邊距撐開的地方也將會被添加上背景顏色。
新聞熱點(diǎn)
疑難解答
圖片精選