发布一个小时后,总感觉不安,查询了一些资料,决定修改本篇。
原文标题是:认知:IE6、IE7的确不识别display:inline-block属性,内容如下:
-------------------------------------自制分割线-----------------------------------------
虽然布局中经常用到display:inline-block,ie6,ie7也确实表现的跟“真”的一样,但是这 哥俩 确实是不识inline-block为何物的。。。
因为我曾经试着对div设置display:inline-block;来布局,FF没有问题,但是ie6不行依然将div解析为block,当时偶觉得是ie的bug。
今天在群里偶然被提起了,一位童鞋提供了一个网址,看了以后深表认同,看到此文的第一句
vapour 写道
在IE6、IE7中不识别display:inline-block属性,但使用inline-block属性在IE下会触发layout,从而使内联元素拥有了display:inline-block属性的表症。
立马就想到了之前div inline-block的尝试,无需犹豫了。
此文写的很清楚了,偶就无需多说,贴上链接,有研究的可以详细参看:
http://www.dovapour.com.cn/article/20090611175.html
-------------------------------------自制分割线-----------------------------------------
每个人都有自己的一些认知,建立在当前的基础之上,但是认知可以有进步。
对于这样的原文,感觉不安,于是还是多查点资料确认的好,否则误人误己。
苏昱(Rainer Su)出品的CSS手册,display一节有云:
写道
在IE5.5中开始支持 inline-block 。你可以使用 inline-block 使对象获得布局而无需指定确切的高( height )和宽( width )。
在IE6.0中开始支持 list-item 。
这样说就是 IE5.5就支持inline-block了,IE6/7当然也支持,但是如何解释 块级元素无法呈现inline-block的效果呢?继续找资料。
找了几篇外国资料,取一个有代表性的:
http://www.quirksmode.org/css/display.html
截图:
IE6/7对于inline-block的支持处于不完全状态:
写道
In IE 6 and 7 inline-block works only on elements that have a natural display: inline.
意思是说,IE6/7的inline-block属性只对原生默认的内联元素(span, a, em......)有效,对于块级元素(div,p,ul......)无效。
另外一个参考:http://homepage.ntlworld.com/spartanicus/ie_block_level_element_inline-block_hack.htm
写道
IE doesn't apply the value inline-block for the CSS display property on HTML elements that default to block level.
那么现在有两个结论:
1、IE6/7不识别inline-block,只是触发了layout,表现跟真实一样。
2、IE6/7不完全支持inline-block,只对内联元素有效。
两者,我更倾向于第二个结论。如果你有更好的证据,请讨论。
不断纠正认知!
- 大小: 31.7 KB
分享到:
相关推荐
在IE6和IE7中这个版本的IE流量器中,对display:inline-block属性支持不佳,下面为大家准备两种方法可以解决此问题,让IE6/IE7 支持 display:inline-block 的方法,感兴趣的朋友可以了解下
在使用CSS实现表现的时候,会经常接触到display:inline-block这一属性,它可以将对象呈递为内联对象,但是对象的内容作为块对象呈递,旁边的内联对象会被呈递在同一行内,允许空格。本文向大家描述一下CSS属性...
IE6不支持这个属性,但IE8开始支持这个属性。 让IE6内联元素具备inline-block特性 由于inline-block会触发IE的layout,所以IE6中只要设置{display:inline-block;}即可。 让IE6区块元素具备inline-block属性,有两...
但是,由于display:inline-block最大的不同就是其没有父元素的匿名包裹特性,这使得display:inline-block属性的使用非常自由,可与文字,图片混排,可内嵌block属性元素,可以可以置身于inline水平的元素中。...
ie6,ie7的haslayout属性是个让人头疼的问题。在做导航条的时候,一般会用到ul li结构,大多数时候我们是把li设置为浮动,让其并排显示在同一行。还有一种方法就是设置li为display:inline;这样可以达到同样的效果,...
但很遗憾,最流行的 IE 和 Firefox 却不支持这个属性(在 Firefox3 版本中将会支持 display:inline-block)。不过 Firefox 下却有私有属性 -moz-inline-box 和inline-block 形似,为什么是“形似”而不是“神似”呢...
曾几何时,display:inline-block 已经深入「大街小巷」,随处可见 「display:inline-block; *display:inline; *zoom:1; 」这样的代码。如今现代浏览器已经全面支持这...IE6、7 真的不支持 display:inline-block 吗?di
NULL 博文链接:https://hc24.iteye.com/blog/832493
NULL 博文链接:https://qiyan86-163-com.iteye.com/blog/551754
其实我们以为应该是这样的:但是ie6,ie7是这样显示的:IE6/IE7下对display:inline-block的支持性不好。解决方案:直接让块元素设置为内
NULL 博文链接:https://tianqiushi.iteye.com/blog/2101378
在使用 CSS 实现表现的时候,会经常接触到 display:inline-block 这一属性,无论是初接触 ... 但很遗憾,最流行的 IE 和 Firefox 却不支持这个属性(在 Firefox3 版本中将会支持 display:inline-block)。不过 Firefox
DOCTYPE,则 Internet Explorer 8 (以及更高版本)支持属性值 "inline-table"、"run-in"、"table"、"table-caption"、"table-cell"、"table-column"、"table-column-group"、"table-row"、"table-row-group"、以及 ...
而现在对于 inline-block 属性运用的需求也越来越多,可惜依旧只有 Firefox3 beta、IE8 beta、Opera、Safari 支持 inline-block 属性(注:原来只有 Opera、Safari 支持),但 IE6、IE7 可以通过触发 hasLayout 来...
在使用 CSS 实现表现的时候,会经常接触到 display:inline-block 这...但很遗憾,最流行的 IE 和 Firefox 却不支持这个属性(在 Firefox3 版本中将会支持 display:inline-block)。不过 Firefox 下却有私有属性 -moz-i
现代浏览器的最新版都支持inline-block,只有该死的ie6、7不支持inline-block,但ie6、7可以通过 display:inline;zoom:1;来模拟。 下面是inline-block兼容的代码: 复制代码代码如下: display:inline-block;*...