背景图片可以设置重复(repeat)不重复(no-repeat),但没有设置拉伸属性。
这里用伪背景实现了拉伸。所谓伪背景,就是用两个重叠的div,下面一个放图片填满div,当成背景。
<html> <head> <style> #back { width: 200px; height: 200px; } #back img { vertical-align:top; /*解决ie浏览器背景填充时的空隙*/ width: 100%; height: 100%; } /*用相对布局让两个div重叠*/ #front { background: transparent; /*前面div透明背景*/ position: relative; width: 200px; height:200px; top: -200px; } </style> </head> <body> <div id="back"> <img src="http://static.cnblogs.com/images/logo_small.gif"/> </div> <div id="front"> <img src="http://static.cnblogs.com/images/logo_small.gif"/> <a href="http://www.baidu.com">百度</a> </div> </body> </html>