IE浏览器文本模式变为杂项(quirks)页面变形

00000
今天正好解决了这个问题,在QQ群里面也碰到有人在问这个问题,故写此记录下。(这个问题让我怀疑在三年前我遇到过,但是没有记录)
问题描述:在ie10到ie7标准模式下没有问题,在ie7\ie8或IE9浏览器文本模式变为杂项页面变形或弹出层不居中;或文件上传至服务器后出现变形。
不清楚什么模式,可以F12看或者

1
alert( document.compatMode );

解决方法:

先瞧瞧页面是html或者jsp
1、代码规范问题
文件头

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

换成

<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.0//EN” “w3.org/TR/html4/strict.dtd”>

1
 

就不会出现Quirks Model了,问题也就解决了
并且

<!DOC.......

前面不要有任何文本。

2、设置为当前浏览器最高版本

1
 

3、把<%@ page language=”java” contentType=”text/html; charset=UTF-8″%> 

1
换<span class="lang:xhtml decode:true  crayon-inline ">成&lt;%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%&gt;</span> 

pageEncoding是jsp文件本身的编码
contentType的charset是指服务器发送给客户端时的内容编码
JSP要经过两次的“编码”,第一阶段会用pageEncoding,第二阶段会用utf-8至utf-8,第三阶段就是由Tomcat出来的网页, 用的是contentType。
第一阶段是jsp编译成.java,它会根据pageEncoding的设定读取jsp,结果是由指定的编码方案翻译成统一的UTF-8 JAVA源码(即.java),如果pageEncoding设定错了,或没有设定,出来的就是中文乱码。
第二阶段是由JAVAC的JAVA源码至java byteCode的编译,不论JSP编写时候用的是什么编码方案,经过这个阶段的结果全部是UTF-8的encoding的java源码。

ps:涉及知识

1
 
<!--常见写法如下:-->
<meta http-equiv="X-UA-Compatible" content="IE=7">  
<!--以上代码告诉IE浏览器,无论是否用DTD声明文档标准,IE8/9都会以IE7引擎来渲染页面。  -->
<meta http-equiv="X-UA-Compatible" content="IE=8">  
<!--以上代码告诉IE浏览器,IE8/9都会以IE8引擎来渲染页面。 --> 
<meta http-equiv="X-UA-Compatible" content="IE=edge">  
<!--以上代码告诉IE浏览器,IE8/9及以后的版本都会以最高版本IE来渲染面。-->  
<meta http-equiv="X-UA-Compatible" content="IE=7,IE=9">  
<meta http-equiv="X-UA-Compatible" content="IE=7,9">  
<meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1">
<!--以上代码IE=edge告诉IE使用最新的引擎渲染网页,chrome=1则可以激活Chrome Frame-->

 

怪异原理有个网友总结的好啊网站地址:http://www.ibm.com/developerworks/cn/web/1310_shatao_quirks/

《IE浏览器文本模式变为杂项(quirks)页面变形》上有1条评论

发表评论

电子邮件地址不会被公开。