Question

网页CSS样式正常，F12之后就乱了，怎么回事儿？

最近写了一套CSS，在win7的IE8下，IE11的IE8兼容模式下 显示都不一样，
在XP IE 8默认模式下好用，在兼容模式下就乱套了
而且一旦按下F12键调试，就乱套了....
请问是怎么回事儿
能够给点儿思路和方向让我排查也行
谢谢！

Answer 1

注意ie开发者工具调试的时候，起作用的不是浏览器模式，而是文档模式！就算浏览器模式是ie8兼容，如果文档模式是别的，那它就会按文档模式显示！浏览器模式当他不存在，努力对不同版本hack吧，加油。

追问

那请问一下，浏览器的文档模式怎么设置？是在Head元素内设置META吗？
另外就是还有一个问题你可能没注意：就是一旦F12，样式就乱了
我说的是没有任何操作，F12,它就乱了
另外，感谢你的回答

追答

文档模式不是写代码设的哟，而是浏览器解析你代码的方式，不同版本的ie有不同的文档模式，所谓兼容性视图就是调到老版本的文档模式来解释你的代码，具体文档模式选择是在开发者工具里调的，或者可以用ietester，并非在代码里设置，你要做的就是让你的网页在不同文档模式下显示正常，按f12应该是打开开发者工具，打开后会占据浏览器的一块显示区域，如果打开工具就乱了，说明你很有可能给网页设置了不合适的height、float和display，f12后，屏幕的基本高度有变化，就导致元素被挤掉了。比如你的body还有其内div高度设置成了100%？我也是新手，以上是我的一些猜测。

追问

谢谢！你说的也有一定的道理，F12回占据浏览器的一块区域