CSSASSCSSASS

ie developers tools对于页面工作者来说，是个不错的调试html，css，js的有利工具，特别是ie8下的ie developers tools，已有媲美Firefox下的Firebug之势。
许多开发者担心升级ie8后，将无法使用ie7预览页面，其实根本不用担心这点，ie8下的ie developers tools可以选择浏览器模式来切换预览ie7的页面效果。

装上ie8后，按F12可以打开i developer tools(这个工具在ie8正式版下是附带的)。它的菜单栏的最后两项便是：浏览器模式和文本模式。
我们可以试一段代码：

你可以试着切换各种模式查看页面效果。
[singlepic id=16 w=400 h=500]

IE developer tools可以说已经是今非昔比了。Firebug的很多好东西他学会了，而且还具备了很多firebug所没有的一些实用工具。下面我一一道来：

1. CSS的选择性修改和预览。以前的ie developer tools可以增加样式，但要修改原有样式，需要写新样式来覆盖。而且，样式不能选择性屏蔽。现在的这项功能虽然界面上很绌，但同firebug一样方便有效。
[singlepic id=18 w=480 h=260]

2 DOM结构修改。这个也是ie8下developer tools新招，尽管firebug早就有了。
除了HTML元素标签，都可以直接修改（相比firebug，ie8还可以直接修改class,id及其它html属性项），使用alt+E则可以进去修改全部（包括HTML元素标签——同Firebug）。
[singlepic id=15 w=600 h=300]

3 DOM结构的查找。不过没有高级搜索，搜索范围是所有html标签，id、class名，textNode，即整个源文件。查找的的会高亮显示。
[singlepic id=17 w=520 h=180]
firebug上有个扩展插件叫Firefinder，查找起来应该更有针对性。

4.ie developer tools上还有三个额外的工具：一个是浏览器屏幕尺寸调整工具，一个是取色器，还一个是标尺工具。
[singlepic id=19 w=420 h=430]

5.还有，ie developer tools的js调试功能也已经可以媲美firebug了。

关于ie8的一些事：
1. 装了ie8后,你原来的傲游，世界之窗等浏览器会使用什么内核？
我相信是ie8内核，但他们对于html+css的解释，应该是按ie7浏览器模式(或则更有可能是ie8兼容模式)来解释的。
傲游浏览器可以在max:config的高级选项中进行设置更改是否采用ie8标准渲染模式。

2. 关于针对ie8的hack
对区别ie6,ie7,ie8来说，前面的测试代码里已经可以看出，”_”和”*”在ie8下都不能识别，那剩下就是怎么区别ie8和FF了。其实，对于html+css的解释，ie和ff很少会出现差异。当然，留这么一手，还是有必要的。
“_”hack针对于ie6;”*”或”+”hack针对于ie6,ie7;”\9″hack则针对于ie6,ie7,ie8有效，剩下的没加hack的就是给FF的了。
测试如下：

3.用ie8浏览网页，在地址栏后头还可能跟着一个按钮——兼容性视图按钮（浏览本地页面文件似乎不会出现这个按钮）。点击这个按钮，网页就进入ie8浏览器兼容模式下的ie7文本模式。
[singlepic id=14 w=430 h=195]
如果网页中被加入了<meta http-equiv=”X-UA-Compatible” content=”IE=EmulateIE7″ />这句，说明网页已经采用ie8浏览器兼容模式下的ie7文本模式进行渲染了，就不会出现这个按钮。

4.ie8抛弃了haslayout私有属性？
前面说ie和ff很少会出现差异，我觉得很大原因因为是ie8抛弃了haslayout。
我们看一个由于haslayout引起的各浏览器的差异显示：

大家都知道，浮动元素应该是脱离文档流的，但是zoom:1会触发haslayout。所以在ie下，原本是应该脱离文档流的浮动元素仍然占据着文档空间，除非去除zoom:1;（注意对比FF和IE看看背景色的位置）。
然而我们会发现，ie8的效果一直同FF保持一致，并没有受haslayout影响。
可以再参考下这里ie私有属性haslayout的困扰。

5.还发现ie8的一个小功能，是Firefox3.5所没有的。ie8可以忽视当前页签下的alert弹出框，在不关闭此弹出框的情况下就可以切换页签。
这个功能在遨游2.5和sougou浏览器也拥有。

标签： EmulateIE7, haslayout, ie developer tools, ie8

这篇文章发布于 2009年08月23号，星期天，15:40，归类于 CSS2, DOM, 浏览器与兼容。 您可以跟踪这篇文章的评论通过 RSS 2.0 feed。 您可以留下评论，或者从您的站点trackback。