haslayout引起的IE6 :hover失效

大家都知道IE6之支持<a>标签的:hover为了,但是通常在做实际效果的时候<a>标签 :hover在IE6下会失效,

看代码:

[code=”html”]

< !DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>
http://www.w3.org/1999/xhtml”>


无标题文档


鼠标经过时改变我的颜色

[/code]

在IE6下“颜色”根本就不会变成红色,其他浏览器都是好的,要解决这个问题就必须触发a:hover的layout,例如a:hover { display:inline-block}或者a:hover { zoom:1}等等。

【转载】haslayout综合

原文地址:http://www.qianduan.net/comprehensive-haslayout.html

要想更好的理解 css, 尤其是 IE 下对 css 的渲染,haslayout 是一个非常有必要彻底弄清除的概念。大多 IE
下的显示错误,就是源于 haslayout。

什么是 haslayout ?

haslayout 是Windows Internet Explorer渲染引擎的一个内部组成部分。在Internet Explorer中,一个元素要么自己对自身的内容进行计算大小和组织,要么依赖于父元素来计算尺寸和组织内容。为了调节这两个不同的概念,渲染引擎采用了 hasLayout 的属性,属性值可以为true或false。当一个元素的 hasLayout 属性值为true时,我们说这个元素有一个布局(layout)

当一个元素有一个布局时,它负责对自己和可能的子孙元素进行尺寸计算和定位。简单来说,这意味着这个元素需要花更多的代价来维护自身和里面的内容,而不是依赖于祖先元素来完成这些工作。因此,一些元素默认会有一个布局。当我们说一个元素“拥有layout”或“得到layout”,或者说一个元素“has layout” 的时候,我们的意思是指它的微软专有属性 hasLayout 被设为了 true 。一个“layout元素”可以是一个默认就拥有 layout 的元素或者是一个通过设置某些 CSS 属性得到 layout 的元素。如果某个HTML元素拥有 haslayout 属性,那么这个元素的 haslayout 的值一定只有 true,haslayout 为只读属性 一旦被触发,就不可逆转。通过 IE Developer Toolbar 可以查看 IE 下 HTML 元素是否拥有haslayout,在 IE Developer Toolbar 下,拥有 haslayout 的元素,通常显示为“haslayout = -1”。 继续阅读

【转载】拥有布局 IE haslayout

原文:http://adamghost.com/2009/03/ie-has-layout-and-bugs-zh/

找们那知道浏览器有bug,而且Windows上的lE的bug 似乎比太多数浏览器都多。IE/Win的衣现与其他浏览器不同的原因之一是,显示引擎使用一个称为布局(layout)的内部概念。因为布均是一个专门针对显示引擎内部工作方式的概念,所以一般悄况下不需要了解它。但是,布局问题是许多IE/Win显示bug的根源,所以理解这个概念以及它如何影响CSS是有捂助的。

什么是布局

Windows 上的IE 使用布局概念来控制元素的尺寸和定位。那些称为拥有布局(have layout)的元素负责本身及其子元素的尺寸和定位。如果一个元旦在没有拥有布局,那么它的尺寸和位置由最近的拥有布局的祖先元素控制。

IE 显示引擎利用布局概念减少它的处理开销。在理想悄况下,所有元素都控制自己的尺寸和定位。但是,这会在IE中导致很大的性能问题。因此,IE/Win 开发团队决定只将布局应用于实际需要它的那些元素,这样就可以充分地减少性能开销。

在默认情况下拥有布局的元素包括:

  • body
  • 标准模式中的 html
  • table
  • tr, td
  • img
  • hr
  • input, select, textarea, button
  • iframe, embed, object, applet
  • marquee

布局概念是Windows 上的I E 特有的,而且它不是CS S 属性.尽管某些CSS 属性会使元ffi拥有布局,但是在CSS 巾无法显式地设宣布局.可以使用JavaScript 函数hasLayout 查看一个元亲是否拥有布局.如果元素拥有布局,这个函数就返回true ; 否则返回falseo hasLayout 是一个只读属性,所以无法使用JavaScript 选行设置. 继续阅读

【转载】On having layout

这篇文章太好了,出处:http://old9.blogsome.com/2006/04/11/onhavinglayout

译者注:一篇很好的文章,很久以前在blog上就推荐过,这两天断断续续花了点时间翻译了一下,推荐读读。
英文原文在此。
http://www.satzansatz.de/cssd/onhavinglayout.htm
文中所有的 layout 这个单词都未作翻译,一来本身这个单词意思就比较多,翻成啥都觉得别扭,二来它也是专有的属性,所以就意会一下吧。水平有限,很多地方都是模模糊糊地意译,发现错误欢迎留言指出。
引用一段来自Dean Edwards
的评价:
I recommend that every CSS designer and DOM scripter read this. Understanding “layout” gives a huge insight into lots of other IE bugs and idiosyncrasies.
(Dean Edwards)

4月16日修订的内容
将quirks模式这一部分单独移动到一篇文章中讲述。
添加:边缘裁切。
添加:收缩包围(shrink-wrapping)现象。

5月17日修订的内容
重写了了浮动元素旁边的元素这一部分。
部分章节小的修正:属性,有关内联级别元素,CSS hacks。
重新整理了部分章节的语言:定义,数据,问题种种,分析,清除浮动和自动扩展适应高度,绝对定位元素。

On having layout

本文修订中
当前版本:Rev. 7 2006–05–17
http://www.satzansatz.de/cssd/onhavinglayoutrev07-20060517.html
修订历史
http://www.satzansatz.de/cssd/layoutchangelog.html
各种语言版本
目录
继续阅读

【转载】IE hasLayout详解

网上转载过来的文章,都不知到谁是真正的作者和翻译者了,但在这里让我们感谢作者和翻译者,共享万岁!

注:hasLayout已经被IE8淘汰。

————————————————————————

IE的haslayout是个很纠结的东西,掌握好CSS就得掌握好它。初学CSS时走了很多弯路,以下几篇文章在我的学习中起了很大的作用,希望能让大家受益。

拥有layout概述

Internet Explorer 中有很多奇怪的渲染问题可以通过赋予其”layout”得到解决。John Gallant 和 Holly Bergevin 把这些问题归类为”尺寸臭虫(dimensional bugs)”[32],意思是这些臭虫可以通过赋予相应元素某个宽度或高度解决。

“Layout”是一个 Internet Explorer for Windows的私有概念,它决定了一个元素如何显示以及约束其包含的内容、如何与其他元素交互和建立联系、如何响应和传递应用程序事件、用户事件等。这种渲染特性可以通过某些 CSS 属性被不可逆转地触发。而有些 HTML 元素则默认就具有”layout”。

微软的开发者们认为元素都应该可以拥有一个”属性(property)”(这是面向对象编程中的一个概念),于是他们便使用了 hasLayout,这种渲染特性生效时也就是将 hasLayout 设成了 true 之时。了解hasLayout将对IE的臭虫会有更多深入的体会甚至解决方案。

继续阅读