CSS3的box-shadow屬性可以讓我們輕松實現圖層陰影效果。我們來實戰詳解一下這個屬性。
先來看一個這個屬性的瀏覽器兼容性:
box-shadow有六個可設值:
img{box-shadow:陰影類型 X軸位移 Y軸位移 陰影大小 陰影擴展 陰影顏色 }
讓我們通過幾個實例來看一個box-shadow的效果，先弄個簡單的html供測試：
<html>
<head>
<style type="text/css">CSS部份寫在這里</style>
</head>
<body>
<img src="test.jpg" />
</body>
</html>
請注意:為了省事兒，下面的CSS代碼中只寫了box-shadow，在實際使用中，你應該把-moz-box-shadow和-webkit-shadow也寫上。你需要做的很簡，復制兩個box-shadow,在它們前面分別加上-moz-和-webkit-。
img {
-moz-box-shadow:2px 2px 10px #06C;
-webkit-box-shadow:2px 2px 10px #06C;
box-shadow:2px 2px 10px #06C;
}
生活不易，碼農辛苦
如果您覺得本網站對您的學習有所幫助,可以手機掃描二維碼進行捐贈
程序員人生，我編程，我富裕，記住wfuyu網，php教程，php學習，php手冊，CMS模版制作
聲明：本站大部分內容是作者原創，少部分收集于互聯網供大家一起學習，原版權很多不明，如有侵權請聯系本站，謝謝！
粵ICP備14040726號-1?? 2015-2020 程序員人生 版權所有
