在CSS中,可以使用border
屬性來設(shè)置元素的四周輪廓。border
屬性可以接收1到4個值,分別代表元素的四個邊(上、右、下、左),每個邊的值可以是一個像素值、顏色值或者是一個邊框樣式值。
如果你想設(shè)置一個元素的四周輪廓為2像素寬、顏色為黑色、樣式為實線的邊框,你可以這樣寫:
border: 2px solid black;
如果你想單獨設(shè)置每個邊的樣式,你可以這樣寫:
border-top: 2px solid black; border-right: 2px dashed red; border-bottom: 2px dotted green; border-left: 2px double blue;
這樣,元素的每個邊都會有不同的樣式,注意,如果某個邊的樣式?jīng)]有設(shè)置,那么它會繼承上一個設(shè)置的樣式。
你還可以使用border-radius
屬性來設(shè)置元素的圓角,如果你想讓元素的四個角都是圓角,你可以這樣寫:
border-radius: 10px;
這樣,元素的所有四個角都會變成10像素的圓角,如果你只想設(shè)置某個角的圓角,你可以使用border-top-left-radius
、border-top-right-radius
、border-bottom-left-radius
和border-bottom-right-radius
屬性。
如果你想要讓元素的輪廓更加突出,可以使用box-shadow
屬性來添加陰影效果。
box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.5);
這樣,元素會有一個5像素的水平和垂直陰影,模糊距離為10像素,顏色為半透明的黑色。