摘抄自原文链接

简单来说display:inline-block,就是可以让行内元素或块元素变成行内块元素可以不float就能像块级元素一样设置宽高,又能像行内元素一样轻松居中。

在ie6中给div设置display:inline-block属性就会出bug。div依然是块元素。但是给span设置该属性就没问题(span本来就是行元素么?挖个坑后续再补充吧。)

我觉得这个方法比较好理解。只摘抄这一个。

方法1:直接让块元素设置为内联对象呈递(设置属性 display:inline),然后触发块元素的 layout(如:zoom:1 等)。兼容各浏览器的代码如下:

#div1 {

  display:inline-block;/*兼容ie8以上及符合所有w3c标准的浏览器*/

  *display:inline;/*兼容ie67专用的css hack*/

  *zoom:1;/*同上*/

}

tips:

  zoom属性(用来设置或检索对象的缩放比例。此外比较尴尬的是常常被另作他用,比如触发ie的hasLayout属性,清除浮动、清除margin重叠等。)

  取值:

    1)normal:使用对象的实际尺寸。

    2)<number>:用浮点数来定义缩放比例。不允许负值

    3) <percentage>:用百分比来定义缩放比例。不允许负值

愿人们早日远离ie67.web程序员的生活越来越美好。阿门。

ie6的display:inline-block实现的更多相关文章

  1. display:inline block inline-block 的区别

    原文地址:http://blog.csdn.net/jly036/article/details/5506182 display:block就是将元素显示为块级元素. block元素的特点是: 总是在 ...

  2. display:inline 和display:inline-block和display:block的区别

    之前讲过块级元素使用display:block 行内元素使用display:inline 那么今天我们就来区分一下display:inline,display:inline-block和display ...

  3. display:inline,display:inline-block,display:block 区别

    之前一直迷惑于display:inline/inline-block/block的异同,在度娘谷哥的帮助下,突然有了一点思路. 按照网上的介绍,inline将对象转化为内联元素,block将对象转化为 ...

  4. display:inline、block、inline-block的区别

    display:block就是将元素显示为块级元素. block元素的特点是: 总是在新行上开始: 高度,行高以及顶和底边距都可控制: 宽度不设是它的容器的100%,除非设定一个宽度 <div& ...

  5. display:inline; display:block;

    block(块级元素): div .from. p .table. pre.h1~h6. dl .ol .ul等 inline(内联元素): span.a.strong.em.label.input. ...

  6. display:block、display:inline与displayinline:block的概念和区别

    总体概念 block和inline这两个概念是简略的说法,完整确切的说应该是 block-level elements (块级元素) 和 inline elements (内联元素).block元素通 ...

  7. 理解display:inline、block、inline-block

    要理解display:inline.block.inline-block的区别,需要先了解HTML中的块级(block)元素和行级(inline)元素的特点,行内元素也叫内联元素. 块级元素 总是另起 ...

  8. display:inline 跟 display:block 跟 display:inline-block区别

    我来说句人话吧.display:inline; 内联元素,简单来说就是在同一行显示.display:block; 块级元素,简单来说就是就是有换行,会换到第二行.display:inline-bloc ...

  9. HTML5 display:inline、block、inline-block的区别--备用

    display:block就是将元素显示为块级元素. block元素的特点是: 总是在新行上开始: 高度,行高以及顶和底边距都可控制: 宽度缺省是它的容器的100%,除非设定一个宽度 <div& ...

  10. display:inline、block、inline-block的区别(转)

    display:block就是将元素显示为块级元素. block元素的特点是: 总是在新行上开始: 高度,行高以及顶和底边距都可控制: 宽度缺省是它的容器的100%,除非设定一个宽度 <div& ...

随机推荐

  1. 小程序:如何让scroll-view包含内容完整滚动

    1.关于scroll-view scroll-view是小程序用来控制可滚动视图区域的组件. 通过设置scroll-x ="true" 或 scroll-y="true& ...

  2. Template 动画

    如果设置Template的动画,也就意味着对每一个具有此Template的对象进行动画处理. 比如对ListBoxI的ItemTemplate进行设置,添加动画,触发器等,每一个ListBoxItem ...

  3. random 随机生成字符串

    # import random# for x in range(10):# i = 0# l = []# while i < 10:# ret = chr(random.randint(33, ...

  4. python requests 包 使用

    1: 发送带 cookie 的 请求 resp = requests.get(self.url_item_list_first_page, cookies=self.cookies) >> ...

  5. ubuntu 报错 libcublas.so.8.0

    在qt程序中使用yolo时报错: ./conjugateGradientPrecond: error while loading shared libraries: libcublas.so.8.0: ...

  6. 洛谷 P2053 [SCOI2007]修车(最小费用最大流)

    题解 最小费用最大流 n和m是反着的 首先, \[ ans = \sum{cost[i][j]}*k \] 其中,\(k\)为它在当前技术人员那里,排倒数第\(k\)个修 我们可以对于每个技术人员进行 ...

  7. L1-1 天梯赛座位分配

    天梯赛每年有大量参赛队员,要保证同一所学校的所有队员都不能相邻,分配座位就成为一件比较麻烦的事情.为此我们制定如下策略:假设某赛场有 N 所学校参赛,第 i 所学校有 M[i] 支队伍,每队 10 位 ...

  8. Codeforces - tag::data structures 大合集 [占坑 25 / 0x3f3f3f3f]

    371D 小盘子不断嵌套与大盘子,最后与地面相连,往里面灌水,溢出部分会往下面流,求每次操作时当前的盘子的容量 其实这道题是期末考前就做好了的.. 链式结构考虑并查集,然后没了(求大佬解释第一个T的点 ...

  9. [转] watch 命令使用(linux监控状态)

    [From] https://jingyan.baidu.com/article/495ba841c5a31738b30eded4.html 可以使用watch 命令设置执行间隔,去反复间隔一条命令或 ...

  10. [转] Ansible 系列之 Playbooks 剧本

    [From] https://www.cnblogs.com/hanyifeng/p/6435875.html 一.Playbooks 介绍 1.Playbooks是Ansible的配置,部署和编排语 ...