CSS影子是指在文本或圖像下方添加一層陰影,從而產生3D效果或深度感。它是通過CSS box-shadow屬性實現的。
box-shadow: h-shadow v-shadow blur spread color inset;
其中,h-shadow和v-shadow確定陰影的水平和垂直偏移距離,blur參數表示模糊度,spread表示擴散度,color表示陰影顏色。
如果需要添加內部陰影,則需要增加inset參數。
下面是一個例子:
shadow { box-shadow: 2px 2px 4px #888888; }
上述代碼表示,在shadow元素下面添加一個2像素水平距離,2像素垂直距離,4像素模糊度的顏色為#888888的陰影。
CSS影子的應用非常廣泛,可以用于增加按鈕的立體感、元素的投影效果、文本的下劃線效果等。
總之,掌握CSS影子的應用可以為網頁設計增色不少。
上一篇css 13視頻教程
下一篇css往上偏移