css把背景图片拉伸至100%

<html>
	<head>
		<title>test</title>
		
		<style type="text/css"> 
			#bodybg { 
			    position: absolute;
			    width: 100%;
			    height: 100%;
			    left: 0px;
			    top: 0px;
			    z-index: 0;
			}
			#bodybg .stretch { 
			    width:100%;
			    height:100%;
			} 
		</style>
	</head>
	
	<body>
		<!-- 背景图片自适屏幕分辨率 -->
		<div id="bodybg">
		  <img src="http://192.168.0.245/darling/static/images/bg2.jpg" class="stretch" />
		</div>
	</body>
</html>
<style type="text/css">
div{
width:100%;
height: 500px;
background-image:url('2.png');
background-size:cover;
filter : progid:DXImageTransform.Microsoft.AlphaImageLoader ( sizingMethod='scale' , src='2.png') 
}
</style>
<body>
<div></div>
</body> 

使用滤镜,其中 sizingMethod="scale" 就是拉伸。 

猜你喜欢

转载自zzc1684.iteye.com/blog/2296405