前段时间就发现本站涂涂研版(z-blog)在手机上浏览本小站的时候就会发现电脑版错位现象,以及今天博友林肆告诉我说用电脑浏览本站的时候:全屏不会出现css+div错位的现象,但是窗口化的时候,尤其是拖拉浏览器大小的时候就会出现严重错位的现象。由于昨晚上夜班,所以就想睡会,但是怎么也睡不着,算了吧,起来解决问题,于是开始解决:
1.由于不熟悉css,所以改起来有点难,也算是学习吧,在网上查找资料,功夫不负有心人,让我找到了,我是借鉴了苹果园子的文章:DIV+CSS让整个网页框架垂直居中显示
方法:要实现功能必须先建立一个容器(margin:0px auto; width:900px; position:relative;),上下边界设置为0,左右页面空白自适应并且相等,可以达到横向居中的效果
但是容器宽度是984px;关于设置position:relative;我也不理解,但是如果设置是absolute和fix时候就会出现问题,不用它时候也正常显示页面(我的网站页面),其他div属性可以根据父级对象容器的设置子级对象属性。
2.将css文件中关于footer的margin-left的属性删除。
3.修改完成后,上传,发现以前做的简繁体切换出现了异常,位置发生错位了,于是找到相关属性设置,以前设置的在原有错位的基础上做的(之前不知道,呵呵),现在处理好了,于是就把以前的定位(margin-left)给删除,使用float:right定位,保存,刷新看下。
4.问题又来了,简繁体切换几个字和头部模板发生重叠现象了,于是查看头部代码,由于css文件使用了float了,所以使用在头部模板文件里的简繁体代码后面加上一句<div class="clear"></div>清除浮动就可以了。
5.保存。刷新缓存(用全动态测试),刷新页面,成功了。
6.实验,三个浏览器(火狐,谷歌,IE11)自由拉伸变换页面,全通过,成功了,在这里再次谢谢博友林肆和苹果园子的文章。
版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容, 请通知我们,一经查实,本站将立刻删除。