css解决网页在不同浏览器下错位的方法

我们如果想布局一个DIV层到网页中的某一个位置，那我们在谷歌Chrome、360浏览器下都正常，但是打开IE或者Firefox浏览器时发现错位的问题。

　　比如假设咱只是想让整个层排在距离上部分10px的位置，但是在IE或火狐浏览器下就偏差严重。

　　css解决网页错位的方法【解决方案】

　　1、页面乱的原因是因为ie6认为一个div超宽了，所以把本应float;right的div挤了下去。而如果设置为ie6下显示正常的宽度，则在ie7和firefox下看页面就会少了一块一样，也很别扭….

　　怎么办？用css hack 来改写css代码

　　改写前：xxx. yyy:{width:600px;} (当设为ie7和firefox下显示正常的600px时，ie6下会错位，改为590px，则ie6下正常，ie7和firefox下显示不完美)

　　改写后： xxx. yyy{width:600px;* width:600px;_ width:590px;}

　　（firefox不认识*和_，而ie都认识*，ie7不支持_，ie6支持_）

　　顺序千万不要乱，因为当出现重复定义时，浏览器默认按最后一下渲染，所以一定要先正常，再*，最后_。

　　这样firefox读取时只看到了正常的定义，而ie都能看到第二个*的定义，于是忽略第一个正常的定义，而ie中因为ie7不再支持_，所以按照第一个带*号的执行，ie6支持_，所以认为带*后的也是重复定义，予以忽略，执行最后一个定义。

　　2、ie6下margin会加倍，要在css中加一句  display:inline

　　还有，如果有一些其他地方不兼容的话，可以使用hack来设置独有的样式

　　div{

　　margin:10px;/*FF*/

　　*margin:15px;/*IE7、IE6*/

　　_margin:15px;/*IE6*/

　　}

　　3、通过!important来进行css hack

　　这种也需要分情况考虑，有时候可能会使得代码过长

　　4、部分IE错位可能是由于浮动问题

　　比如在360浏览器下，可能会帮您的网页默认进行一个排版，但是IE可能你就必须给他一个限定值让他能懂你想把你的网页怎么布局？

　　例如：.div{float:left;}强调一下，我这个层的位置需要和某个层一样居左显示。

　　好了，以上就是无锡做网站公司马氪软件为大家分析的通过修改CSS来解决网页错位的几个解决方案，希望对大家有所帮助。

声明：除非注明，本站内容由无锡网站建设马氪软件原创发布©，转载请联系我们授权合作。