码迷,mamicode.com
首页 > 其他好文 > 详细

div背景图片自适应

时间:2015-03-11 17:15:05      阅读:145      评论:0      收藏:0      [点我收藏+]

标签:div背景图片自适应

在为文莱的一个天气预报网站做页面,突然遇到一个问题,就是需要div的背景图片自适应屏幕大小,网上找了好久,chrome都无效,最后找到了一个,说要这么写

.product_wx {
	background:url('../images2/bgd_1.jpg');
	filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod='scale');  
	-moz-background-size:100% 100%;  
        background-size:100% 100%;  
}

照样子写上去后,发现chrome还是不显示,于是加上了height,图片才可以正常缩放,值得注意的是如果用 width:100%;也是无效的。所以最终结果是

.product_wx {
	background:url('../images2/bgd_1.jpg');
	filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod='scale');  
	-moz-background-size:100% 100%;  
        background-size:100% 100%;  
	height:858px;
}

# 以上结果都是在chrome下测出。

div背景图片自适应

标签:div背景图片自适应

原文地址:http://blog.csdn.net/huwei0518/article/details/44200559

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!