web前端---------布局与css
这段时间搞web前端搞的我都神经了。
明明在本地调试的时候访问正常，放在服务器上的时候再访问布局就有问题。搞的我都神经了。
问题来了：
Q1：
| 参数 |
环境1 |
环境2 |
| 服务器 |
tomcat版本一致 |
tomcat版本一致 |
| 服务器所在的系统环境 |
自己的pc
|
公共网的linux |
| 浏览器版本 |
360-V7兼容模式 |
360-V7兼容模式（ |
| 浏览器所在位置 |
自己的pc |
自己的pc |
| 页面布局效果 |
是预期的效果 |
不是预期的效果 |
结果为什么是这样啊?变量明显只有一个，那就是服务器所在的系统环境不一样。
稍后解释。
Q2：
本地调试调试web程序，更换浏览器，发现有些浏览器布局正常，有些不正常。
-----------------------------------------------------------------------传说中的分割线-------------------------------------------------------------------------------------
浏览器版本的实质在于浏览器内核的替换。个别浏览器提供双核：极速，兼容。极速模式的内核是谷歌浏览器内核，兼容模式的内核是ie内核。
我所用到的项目在极速模式下布局正常，在兼容模式下个别浏览器出现不正常。那么ie有什么秘密呢。
通过资料查询得知，兼容模式下可以指定 “浏览器模式” 和“文本模式”。
浏览器模式可以模拟你需要的浏览器版本7,8,9....
文本模式可以模拟你的web页面渲染引擎。<--------------------------此为核心。
不同ie有不同的渲染引擎以及Quirks引擎。不同引擎导致页面布局效果不一致。此为布局紊乱的结果。
那么只要指定渲染引擎就可以搞定界面布局紊乱了。
实测，ie渲染引擎在使用ie8以及ie8以上的时候，界面正常。win7系统自带ie8。
因此在web页面加上头部加上
<meta http-equiv="X-UA-Compatible" content="IE=edge" />【表达的意思：使用ie最高渲染引擎来渲染】
就ok了。
（以下代码未在工程中引用。）
那么ie7一下怎么解决。
先来看看下面的CSS代码：
_background-color:red;
下面我简单解释一下各浏览器怎样理解这三个属性：
在FF下，第2、3个属性FF不认识，所以它读的是background-color:orange;
在IE7下，第3个属性IE7不认识，所以它读第1、2个属性，又因为第2个属性覆盖了第1个属性，所以IE7最终读出的是第2个属性*
在IE6下，这3个属性IE6都认识，所以3个属性都可以读取，又因为第3个属性覆盖掉前2个属性，所以IE6最终读取的是_
这应该可以解决了吧！
-------------------------------------------------------------分割线----------------------------------------------------------------
前提：
用户不会动用F12模式，所以用户要的效果就是极速和兼容切换不会出现布局问题就ok。所以我们设置渲染引擎就可以解决兼容模式布局问题。
那么回到最初的问题：
A1：调试发现访问服务器上的网页时，渲染模式成为Quirks模式。而访问本地的时候，渲染模式时ie8。所以访问本地服务器正常，访问linux服务器不正常。那么为什么会出现这种情况（实为不解，应该和ie安全设置有关吧。有人知道的话，请留言）
A2：不同浏览器的默认渲染引擎不一样，答案和A1差不多。
郑重声明：本站内容如果来自互联网及其他传播媒体，其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享，并不代表本站赞同其观点和对其真实性负责，也不构成任何其他建议。
