利用CSS給元素設置陰影是一個很常見的效果，但是當我們需要讓陰影透明化時，很多人可能并不知道怎么做。下面就跟大家分享一下如何給CSS陰影設置透明度。 首先我們需要用到CSS3的rgba屬性，它和普通的RGB顏色值一樣，只是多了一個透明度的設置。 我們先看一個簡單的CSS陰影代碼：

.box {
box-shadow: 5px 5px 10px 0px #000;
}

上面的代碼就是給一個類名為“box”的元素設置陰影，陰影的屬性值依次為：陰影水平偏移量，陰影垂直偏移量，陰影模糊半徑，陰影擴散半徑，顏色值。 現在我們要給這個陰影設置透明度，只需要在顏色值后面加上一個透明度值即可。比如我們想要一個半透明的黑色陰影，可以這樣寫：

.box {
box-shadow: 5px 5px 10px 0px rgba(0,0,0,0.5);
}

上面的代碼中，rgba的前三個參數表示黑色，最后一個參數0.5表示50%的透明度。這樣我們就成功給陰影設置了透明度。 同樣的，如果我們想要一個白色的陰影，也可以像下面這樣寫：

.box {
box-shadow: 5px 5px 10px 0px rgba(255,255,255,0.5);
}

上面的代碼中，rgba的前三個參數表示白色，最后一個參數0.5表示50%的透明度。 總之，設置CSS陰影的透明度其實就是在顏色值后面加上一個透明度值。而這個透明度值，通過CSS3的rgba屬性來實現。掌握了這個方法，我們便可以更加靈活地運用CSS陰影效果了。