加入收藏 | 设为首页 | 会员中心 | 我要投稿 大同站长网 (https://www.0352zz.com/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 运营中心 > 建站资源 > 经验 > 正文

HTML中经过CSS设置背景图片自适应浏览器大小

发布时间:2022-04-28 10:55:10 所属栏目:经验 来源:互联网
导读:div id=formbackground style=position:absolute; width:100%; height:100%; z-index:-1 img src=pictures/background.jpg height=100% width=100%/ /div 这个上面是通用一般的写法 意思就是在你想设置背景的DIV中,添加以上代码,把这个DIV设置为底层,你的
         <div id="formbackground" style="position:absolute; width:100%; height:100%; z-index:-1">   <img src="pictures/background.jpg" height="100%" width="100%"/>   </div>
 
        这个上面是通用一般的写法
 
        意思就是在你想设置背景的DIV中,添加以上代码,把这个DIV设置为底层,你的其他内容会浮在这个DIV上面,修改你的img src路径就可以了。
 
        但是对于很多浏览器来讲还是有问题,因为它预知你的浏览器是一个,如果用户接了个扩展显示器,就是有2个或者3个显示器,怎么搞?这特么的肯定不对啊,height="100%"这个是根据你的屏幕分辨率来的,不是你的浏览器的大小
  
所以我们要引入JS,最简单的就是用jquery了
 
调整为如下代码:
 
<div id="formbackground" style="position:absolute; z-index:-1;"><img src="10.jpg" height="100%" width="100%"/></div><script type="text/javascript">$(function(){ $('#formbackground').height($(window).height()); $('#formbackground').width($(window).width());});</script>
上面这个才对!

(编辑:大同站长网)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!