您的位置: 首页 / Design, this site / V4 模板修正:IE6 兼容性问题

V4 模板修正:IE6 兼容性问题

Published at Dec 26, 12am / Keywords: , , , , , ,

昨天放出新模板时,很多朋友反应版面“有点乱”。开始我还认为是大家审美观点不同,对于这样大红大紫的页面难以接受,看着眼晕,所以感觉乱,后来还是小圈同学的一张截图惊醒了我。IE6 下面看何止是有点乱呀,简直是乱的惨不忍睹。

由于我平时都是用 Firefox 浏览的,所以在后期测试时就没有用其它浏览器看看。根据经验,肯定又是 Box 定义的问题,但是明明在做 HTML 效果页面的时候是好好的( IE6 FF Opera 都测试通过),怎么做成模板后 IE6 又不认账了呢?

仔细对比了一下代码,发现在最终生成的页面中比效果页多出一行,就是第一行那个 <?xml version=”1.0″ encoding=”UTF-8″ ?> ,原来是犯了大忌!从模板中去掉这一行,IE6 下面的效果瞬间就正常了。

众所周知,IE 在处理 CSS Box 定义方面与 W3C CSS 有所不同,但对于 IE6 这个不同不是绝对的。IE6 内部事实上有两套 Box 定义,如果网页第一行为 <?xml version=”1.0″ encoding=”UTF-8″ ?> (一般 xhtml 网页都会有这一行),IE6 就会使用针对 xhtml 的引擎,并使用不规范的 box 定义,于是也就产生了页面错位等现象。IE 在处理 xhtml 文件时,事实上仍然使用的是 HTML 解析引擎(IE7 也仍然如此),所以根本没有必要在开头加上那一行。不加的话,IE6 的 Box 定义和 W3C CSS Box 定义基本上一致,可以有效的降低编写 CSS 的工作量。如果加上坏处主要有两点,第一就是 IE Box 模型的使用会导致页面错位,另一点就是对于像 Firefox 这样的浏览器会使用 XML 引擎来处理页面,一旦页面中出现任何不符合 XML 规范的内容(例如某个访客的留言中 HTML 标签未封闭),整个页面就无法显示了。所以现阶段,还是不要加这一行的好。

目前已知的问题,IE5 浏览还是不行,不仅CSS有问题,Javascript 也执行不了。不过 IE5 都是淘汰货了,还有必要支持它吗?其它浏览器(如 Konqueror Safari 之类)我还没有时间、条件来测试,有条件的朋友帮忙测一下,最好能把有问题的截图发给我,谢谢啦。

此外,接着这个机会,好好调整了一下页面,现在可以通过 XHTML 1.1 标准了 🙂

发表您的观点或推荐本文 Loading...