*

*

*

*
,
, , <button></p> <p> * <iframe>, <embed>, <object>, <applet></p> <p> * <marquee></p> <p>下列属性也会导致 hasLayout=true</p> <p>position: absolute</p> <p> Refers to its containing block, and that’s where some problems begin.</p> <p>float: left|right</p> <p> The float model has a lot of quirks due to some aspects of a layout element.</p> <p>display: inline-block</p> <p> Sometimes a cure when the element is at inline level and needs layout. Applying layout is probably the only real effect of this property. The “inline-block behaviour” itself can be achieved in IE, but quite independently: IE/Win: inline-block and hasLayout.</p> <p>width: any value</p> <p> This is often an implicit fix, more often the trigger when hasLayout does things wrong.</p> <p>height: any value</p> <p> height: 1% is used in the Holly Hack.</p> <p>zoom: any value (MSDN)</p> <p> MS proprietary, does not validate. zoom: 1 can be used for debugging.</p> <p>writing-mode: tb-rl (MSDN)</p> <p> MS proprietary, does not validate. </p> <p>inline 元素的特殊情况</p> <p> * width and height trigger hasLayout in IE 5.x and IE 6 in quirks mode only. As of IE6, when the browser is in “standards-compliance mode” inline elements will ignore the width and height properties, and setting the width and height properties will not cause the element to have layout.</p> <p>ie5.x和 ie 6 quirk 模式中，设置了 width 或者 height 属性的元素 hasLayout=true。ie 6 standards-compliance mode（标准兼容模式）时，设置了 width 或者 height 属性的元素 hasLayout=false</p> <p> * zoom always triggers hasLayout, but it’s not supported in IE5.0.</p> <p>zoom 会导致 hasLayout=true，但 ie 5 不支持该属性。</p> <p>通过 x.currentStyle.hasLayout 来获得 hasLayout 值（注意IE only，其他浏览器无效）。</p> <p><textarea rows='12' cols='40' class='bk ohtml' id='temp93098'></p> <p>段落 p</p> <div>块 div</div> <table> <tr> <td>表格 td </td> </tr> </table> <p><script></p> <p>objs=document.all</p> <p>str=""</p> <p>for(i=0;i<objs.length;i++){</p> <p> str+=objs[i].tagName+"-"</p> <p>}</p> <p>//alert(str)</p> <p>document.body.onclick=function(){obj=event.srcElement;alert(obj.tagName+":"+obj.currentStyle.hasLayout)}</p> <p></script></p> <p> [Ctrl+A 全部选择 提示：你可先修改部分代码，再按运行]

hasLayout 不可写。也就是说，你不能通过 hasLayout=true 来设置 hasLayout 属性，而只能通过 width,height,zoom 等改变 hasLayout 状态。

Another thing to consider is how “layout” affects scripting. The clientWidth/clientHeight properties always return zero for elements without “layout.” This can be confusing to new scripters and is different to how Mozilla browsers behave. We can use this fact to determine “layout” for IE5.0: If the clientWidth is zero then the element does not have layout.

hasLayout=false 元素返回的 clientWidth/clientHeight 属性总是0。比如下面的代码

</p> <div style="background: red" onclick="alert(this.currentStyle.hasLayout);alert(this.clientHeight)">this div hasLayout=false</div> <div style="background: blue;width:80%;" onclick="alert(this.currentStyle.hasLayout);alert(this.clientHeight)">this div hasLayout=true</div> <p> [Ctrl+A 全部选择 提示：你可先修改部分代码，再按运行]

大多数情况下，我们是需要 hasLayout=true 的，通过CSS设置 hasLayout=true 的hack方法有：

/* */

* html .gainlayout { height: 1%; }

/* */

或者

.gainlayout { _height: 0; }

或者

或者针对最近发布的 IE 7 测试版

注意这些方法都是有局限性的，具体请参照原文。

ie使用 float 要小心，具体见 http://www.satzansatz.de/cssd/onhavinglayout.html#clear

牵扯的问题越来越多，自己看吧，参考下面文章。

相关资料：

On having layout

HasLayout Overview

0 Comments

各种浏览器对照表

Mar 22, 2006 Author: | Filed under: Uncategorized

这个 浏览器对照表 很详细。包括下面这些浏览器的特性：

作者，是否开源，版权保护，渲染引擎，价格，发行日期，操作系统支持，书签管理功能，下载管理器，密码管理功能，表单管理，拼写检查，是否支持tab浏览，pop-up blocking，预搜索，广告过滤，页面缩放，html access 键支持，tab导航，Spatial navigation，Caret navigation，鼠标动作，文本朗读，声音控制，web 技术支持（CSS2 Frames Java JavaScript XSLT XHTML 1.0 XHTML 1.1 MathML XForms RSS Atom SVG XPath），支持协议（HTTP E-mail FTP NNTP (Usenet) SSL IRC Gopher IDN data: URL BitTorrent），支持的图片格式（JPEG GIF PNG MNG TIFF SVG PDF ），支持的语言版本，重要安全漏洞

0 Comments

Pages (6): « 1 2 3 4 5 » ... Last »

Flickr PhotoStream