- 3/5
- 1
- 2
- 3
- 4
- 5
织梦DedeCMS视频教程买空间 租服务器 选网硕互联！ 无忧站长工具,百度权重一键全查!
CSS漂亮的图片边框，边框是用背景图片修饰的，不过可以自适应大小，这点挺实用的，不论你的图片有多大，它始终显示在图片的外围，不会错位，这当然还要归功于CSS的功劳。
<html> <head> <title>漂亮图片边框</title> <style type="text/css"> body{ text-align:center; margin-top:100px; } .in{ border:1px solid #666; padding:4px; } .out{ float:left; <!--<img src="http://p1.mb5u.com/texiao/1/20110225160524402.gif">-->background:url("http://p1.mb5u.com/texiao/1/20110225160524402.gif") no-repeat right top; } .mir{ <!--<img src="http://p1.mb5u.com/texiao/1/20110225160524403.gif">-->background:url("http://p1.mb5u.com/texiao/1/20110225160524403.gif") no-repeat right bottom; padding:10px; padding-bottom:0; padding-left:0; } .mil{ <!--<img src="http://p1.mb5u.com/texiao/1/20110225160524404.gif">-->background:url("http://p1.mb5u.com/texiao/1/20110225160524404.gif") no-repeat left top; } </style> </head> <body> <div class='out'> <div class='mil'> <div class='mir'> <div class='in'> <img src='http://p1.mb5u.com/texiao/1/20110225160524405.jpg' /> </div> </div> </div> </div> <div class='out'> <div class='mil'> <div class='mir'> <div class='in'> <img src='http://p1.mb5u.com/texiao/1/20110225160524406.jpg' /> </div> </div> </div> </div> </body> </html>