CSS3內填充(Padding)是指元素內容與邊框之間的空白區域,也稱為填充區域。它可以用來調整元素的大小和形狀,同時也可以為元素增加更多的空白。
Padding屬性可以用來設置任意單個方向或同時設置上下左右四個方向的填充量。Padding屬性有如下語法:
選擇器 { padding: 上 右 下 左; }
其中,上下左右值可以為正、負值或百分比。如果只有一個值,那么這個值將應用于四個方向。如果有兩個參數,第一個參數將應用于上下方向,而第二個參數將應用于左右方向。
以下是一些Padding屬性的實例:
.box1 { padding: 20px; } .box2 { padding: 20px 0; } .box3 { padding: 10% 20%; }
在上述代碼中,box1元素的上下左右填充均為20像素,box2元素的上下填充為20像素,左右填充值為0,box3元素的上下填充為容器寬度的10%,左右填充為容器寬度的20%。
CSS3內填充還可以通過Padding-top、Padding-right、Padding-bottom、Padding-left單獨設置每個方向的填充值:
.box4 { padding-top: 10px; padding-right: 20px; padding-bottom: 30px; padding-left: 40px; }
在box4元素中,上下左右分別設置了10像素、20像素、30像素、40像素的填充值。
CSS3內填充的應用場景非常廣泛,它可以被用作調整文檔與網頁元素之間的距離、調整表格單元格內容與邊框的間距、為按鈕、導航欄和面包屑等元素增加一定的空白等。
上一篇mysql的php