投影是 CSS3 中的一個重要特性,在網頁設計中有著廣泛的應用。本文將介紹一些常用的投影效果的代碼實現。
要實現一個基礎的投影效果,可以使用box-shadow
屬性。
selector { box-shadow: h-shadow v-shadow blur spread color inset; }
h-shadow
為水平方向的偏移量,v-shadow
為垂直方向的偏移量,blur
為模糊程度,spread
為擴張距離,color
為投影顏色。如果要讓陰影在元素內部生成而不是在外部,則需要加上inset
參數。
一個常見的效果是陰影邊框。可以通過如下代碼實現:
selector { box-shadow: 0 0 10px rgba(0,0,0,0.5); }
還有一種常見的效果是在圖片上添加陰影??梢允褂萌缦麓a:
selector { box-shadow: 0 0 10px #aaa; }
當然,如果你想要一些特殊的效果,你可以仔細調整代碼參數。
綜上所述,投影通過 CSS3 可以輕松實現,是一個非常實用和易于操作的特性。
上一篇asp用jQuery
下一篇asp中jquery無效