在CSS中,我們可以使用box-shadow
屬性來(lái)創(chuàng)建邊框投影,這個(gè)屬性接受四個(gè)值,分別是水平偏移、垂直偏移、模糊半徑和顏色。
我們可以給div元素添加邊框投影:
div { box-shadow: 10px 10px 5px #888; }
在上面的代碼中,10px 10px
表示投影的水平偏移和垂直偏移都是10像素,5px
表示投影的模糊半徑是5像素,#888
表示投影的顏色是灰色。
我們還可以給邊框添加內(nèi)陰影,使用text-shadow
屬性:
h1 { text-shadow: 2px 2px 4px #333; }
在上面的代碼中,2px 2px
表示內(nèi)陰影的水平偏移和垂直偏移都是2像素,4px
表示內(nèi)陰影的模糊半徑是4像素,#333
表示內(nèi)陰影的顏色是深灰色。
注意,box-shadow
和text-shadow
屬性都可以接受五個(gè)值,分別是水平偏移、垂直偏移、模糊半徑、顏色和樣式,樣式可以是inset
(內(nèi)陰影)或outset
(外陰影)。
我們可以給div元素添加外陰影:
div { box-shadow: 10px 10px 5px #888 outset; }
在上面的代碼中,outset
表示陰影在邊框的外部。
通過(guò)以上代碼,我們可以輕松地給網(wǎng)頁(yè)元素添加邊框投影和內(nèi)陰影,使它們更加突出和美觀。