在CSS中,我們經(jīng)常需要為元素添加邊框來美化頁面。邊框可以通過邊框?qū)傩?border)進行設置,而且我們還可以通過使用border-radius屬性,來控制邊框的圓角值,讓頁面變得更加美觀。
.border{ border: 1px solid #000000; border-radius: 10px; }
上述代碼用來設置一個帶有邊框并且有10像素寬圓角值的元素。其中,border-radius屬性用來設置元素邊框的圓角大小,其值可以是像素值(px)、百分比(%)或者對角線名稱(如top-left)。同時,我們可以為不同的邊框設置不同的圓角值,例如:
.border{ border: 1px solid #000000; border-top-left-radius: 10px; border-bottom-right-radius: 15px; }
上述代碼用來設置一個帶有邊框的元素,同時只為左上角和右下角邊框設置不同大小的邊框圓角值。我們也可以使用“/”符號指定四個不同方向的圓角值,例如:
.border{ border: 1px solid #000000; border-radius: 10px 0 10px 0; }
上述代碼用來設置一個帶有邊框的元素,同時設置左上角和右下角為10像素圓角,而設置右上角和左下角為0像素圓角。