...
相信很多前端会遇到这个问题:要做一个尺寸自适应的页面,其中某个容器的背景图也需要跟着容器的尺寸一起改变。如果背景是有规律的纯色或者渐变还好办,直接平铺即可。但如果背景是要求完全显示的一张完整的图片呢,我们使用background image这个属性是没办法达到我们的要求的,因为背景图的大小是不会随着容器改变的。 如此我们就要考虑能达到我们要求的元素了,用img元素能够实现尺寸的适应: 这样一来, ...
2014-08-12 16:28 0 3663 推荐指数:
...
主要使用:background-size:cover; <body style="width:1024px;height:700px;"> <form id="form1" run ...
...
...
效果图: 使用图片: ...
效果参考 http://vip.163.com/ http://vip.sina.com.cn/ 特点:背景图片在不变形的情况下尽可能的显示完整,窗口不出现滚动条,始终全屏显示 JS: #content代表最外层的DIV,使页面全屏 .bg代表背景图片 src ...
一、现背景图片的自适应分辨率: 二、3种方法使背景图随电脑分辨率改变,兼容新老办法 1、尝试以下css代码,对每个分辨率设置不同的背景图片: 2、利用css3新属性:background-size具体使用方法可以百度:css3 background-size ...
HTML中使背景图片自适应浏览器大小 1、图片不够大,又background属性不能拉伸图片; 2、只能用个div,把其z-index值设为负,并使这个div大小为整个body大小,在div里用> 3、body的background属性去掉,要不然会被遮住 例子 ...