使用CSS为图片添加更多趣味的5种方法
使用Photoshop为每个图片添加某种样式虽然可行,但会是相当乏味且困难的长久工作。下面要介绍的CSS技巧将帮助你从痛苦中解脱出来! 阴影效果 通过使用带有一些padding之的背景图来添加阴影效果。 HTML <img class=”shadow” src=”sample.jpg” alt=”” /> CSS img.shadow { background: url(shadow-1000×1000.gif) no-repeat right bottom; padding: 5px 10px 10px 5px; } 双边框效果 这应该是目前最常见的技巧,我们通过以下方式创建说边框。 HTML < img class = "double-border" src = "sample.jpg" alt = "" / > CSS img . double - border { border : 5px solid # ddd ; padding : 5px ; /*Inner border size*/ background : # fff ; /*Inner border color*/ } 图片外框效果 webdesignerwall.com 上有最好的讲解,这个效果是基于在上面层叠一个有透明度的图片的技术。至于IE6的PNG透明度问题,可以参考这篇教程。 HTML < div