文本对齐:证明实现与IE兼容的文本对齐。
为了更好地了解CSS,特别是CSS在IE的渲染,haslayout是非常必要和全面的概念。大多数IE
下一个显示的错误是来自haslayout。
haslayout是什么
haslayout是Windows Internet Explorer的渲染引擎内部组件。在Internet Explorer中,一个元素可以计算它的大小和组织本身,或依靠父元素的大小来计算和组织内容。为了适应这些不同的两个概念,渲染引擎使用的haslayout属性,它可以是真实的假。当一个元素的haslayout属性是真实的,我们说的元素有一个布局(布局)。
当一个元素有一个布局,它负责尺寸计算与自己的元素和可能的后代的位置。简单来说,这意味着该元素需要花更多的钱来保护自己和它的内容,而不是依靠祖先元素来完成这些任务。因此,一些元素默认情况下会有一个布局。
当我们说一个元件布局或布局,或一个元素的布局,我们说它的微软haslayout专有属性设置为true。
一个布局元素可以用默认的布局或通过设置一些CSS属性的布局元素。通过IE开发者工具条,我们可以看到,无论是在伊江的HTML元素haslayout,IE开发者工具下的haslayout元素通常表现为haslayout =工具栏。
特别注意的是事实,haslayout被遗弃在IE 8和后来的IE版本,所以在现实的发展,有必要引起一些在IE 8浏览器元素haslayout。
对haslayout元素会影响大小和元素的触发位置,它会消耗更多的资源,所以默认的IE设计师只对haslayout元素部分(这是默认的触发元件部分将触发haslayout,和BFC完全由开发商通过特定的CSS触发器是不一样的,这部分的元)以下:
*身体和HTML
*表、TR、TH、TD
* img
*人力资源
*输入按钮,文件,选择文本,字段集
*字幕
*框架iframe框架,
*对象,小应用程序,嵌入
如何激发haslayout
大部分的IE显示错误可以通过刺激的元素的haslayout属性修正。元素的haslayout可以通过设置CSS大小属性(宽度/高度兴奋)等,使其具有布局。
如下所示,您可以设置以下CSS属性。
*显示:内联块
*高度:(除汽车以外的任何值)
*浮动:(左或右)
*立场:绝对
*宽度:(除汽车以外的任何值)
*写作模式:TB RL
*缩放:(除了正常的任意值)
Internet Explorer 7还有一些附加属性(不完整的列表):
*最小高度:(任意值)
*最大高度:(除无任意值外)
*最小宽度:(任意值)
*最大宽度:(除无任意值外)
*溢出:(除了可见的任意值)
* overflow-x:(除了可见的任意值)
* overflow-y:(除了可见的任意值)
*职位:固定
overflow-x和overflow-y在CSS3盒模型属性,还没有被浏览器广泛支持。
对于内联元素(默认是内联的元素,如跨度,或显示:内联;元素),
宽度和高度只触发haslayout在IE5。X和IE6或怪癖模式的更新版本,IE6,如果运行在标准兼容模式的浏览器,内联元素会忽略宽度或高度属性,所以宽度或高度不可命令在这种情况下,有布局。
变焦可以触发haslayout,但它不支持ie5.0.it建议变焦:1被用于触发该元素的haslayout。
随着布局元素是否显示:内联,然后说它的行为和标准内联块很相似:在段落和普通文本在水平方向连续排列的垂直对齐,和大小可根据内容自适应调整。这也可以解释为什么内联元素可以包含块级元素只有在IE /赢了,但没有问题,因为在其他浏览器,显示:内联函数是内联的,不像IE /赢,一旦内联元素的布局,它将成为内联块。
调试和解决问题的haslayout
当一个网页在伊江有一个异常的表现,你可以尝试激励haslayout是否的问题,常用的方法是设置一个变焦:1种元素的CSS。变焦的使用:1是因为,在大多数情况下,它可以在不影响现有的环境刺激因素的haslayout。一旦问题消失,这是基本haslayout的原因。那么问题就可以通过设置相应的CSS属性修改。首先要考虑的是如何设置宽度和高度属性的元素,其次是其他属性。
IE6及更早版本中,常用的方法被称为Holly hack(Holly Hack),即元素的高度是1%(高度:1%;)。重要的是要注意,这种方法失败时,该元素的溢出属性设置为可见。或使用IE的条件注释
IE7,设置元素的最小高度的最佳方式是0(最小高度:0;)。
常见的错误的haslayout问题引起的
IE6和双空白边浮动bug版本较低
缺陷修复:显示:内联;
对ie5-6 / 3像素偏移bug赢得
BUG修复:_height:1%;
IE6躲猫猫(躲猫猫)的bug
BUG修复:_height:1%;
这里有一些影响,触发haslayout元
1。防止外缘折叠
两个div是叠加在垂直的外缘,而触发的haslayout不会发生这样的元素,如下:
在上面的例子中,三个div包含一个P元素,和三个div和P元素包含顶部和底部之间的外部距离,但只有第三分利润并不折叠它的子元素P,这是因为第三DIV使用变焦的外缘:1触发haslayout并防止其折叠出其子元素的外部距离。
此外,溢流型隐藏触发元件也使用的例子,它利用BFC预防外从动件实现的统一表达伊江元素和现代浏览器。
2。可以包含一个浮动的子元素,包括浮动的子元素时的计算高度计算。
结果如下:
在上面的例子中,有两个div,每个包含一个浮动元素P,但第一个div实际上是判断浏览器,它没有高度和宽度,即高度为0,与上、下边界重叠在一起,二div使用变焦:1触发haslayout,它可以包含一个浮动元素,所以它可以正确显示的高度,和它的边缘位置是正常的。
此示例还使用溢出:隐藏触发BFC,类似的情况下,允许使用可以包含子元素特征浮动元素集成在伊江和现代浏览器。
三.背景图像显示问题
背景元素不能正确显示是一种在网页代码的重构的最常见的问题,在IE 7及以下版本的IE,元素的高度和宽度设置不经常不能显示背景图像(背景颜色是正常的,这实际上是有关haslayout)。事实是没有元素触发haslayout不能显示背景图。如上所述,触发haslayout是元素使布局。换句话说,带有布局的元素可以正确显示背景图:
两部以上的所有设置背景图,但只有变焦的使用:1触发的haslayout二div正确显示背景图。
在这个例子中,没有BFC触发的元素,因为在现代浏览器中,元素本身没有背景图显示。
上面的文章告诉文本对齐:为实现文本兼容IE的两端兼容,我希望你喜欢它。