close
呈現的效果如下圖：
詳細做法如下：
I. 下載圖檔，併上傳至自己的網路空間(我是放在Google Page Creator)中：
II. 編輯style-sheet模板，並加入以下css控制碼：
III. 在html中想要出現圖片地方加上：
詳細做法如下：
I. 下載圖檔，併上傳至自己的網路空間(我是放在Google Page Creator)中：
fuzzy_shadow.png
fuzzy_shadow1.png
fuzzy_shadow2.png
II. 編輯style-sheet模板，並加入以下css控制碼：
.shadow {
float: left;
width: auto;
background: url(http://bangdoll2k.googlepages.com/fuzzy_shadow.png) no-repeat bottom right;
}
.shadow div {
background: url(http://bangdoll2k.googlepages.com/fuzzy_shadow1.png) no-repeat right top;
}
.shadow div a {
background: url(http://bangdoll2k.googlepages.com/fuzzy_shadow2.png) no-repeat left bottom;
padding: 0 6px 6px 0;
display: block;
}
.shadow img {
background-color: #fff;
color: #000;
border: 1px solid #999;
padding: 4px;
vertical-align: bottom;
}III. 在html中想要出現圖片地方加上：
<div class="shadow"><div><a href="連結網址"><img src="圖片來源網址" /></a></div></div>
<br style="clear: both;" />製作方法參考自Oui-Blog │如何利用CSS製作圖片陰影
全站熱搜
留言列表
