摘抄自原文链接

简单来说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. 使用st link v2向stm32下载和调试程序

    st官网 正版ST-link/V2引脚定义和注意事项 分为ST-LINK/V2和ST-LINK/V2-ISOL两种型号 是STM8和STM32微控制器(MCU)系列的在线调试器和编程器(还是下载器.仿 ...

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

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

  3. SCPO2015 小凸玩矩阵

    题目链接:戳我 二分答案+最大流. 看到第K大的数的最小值是多少,我们想到二分,把他转化为最大数最小问题--二分一个数x,如果有>=n-k+1个数不比它大,那么它就应当不大于当前数,否则应当大于 ...

  4. GPU大百科全书 第一章:美女 方程与几何

    沉鱼落雁   前言:当你酣战在星际2的时候,或者当你在艾泽拉斯游历的时候,你有没有想过,眼前的这些绚丽的画面究竟是怎么来的呢?也许对大多数人来说,GPU对于图形的处理过程并不是那么重要,但总会有些人, ...

  5. 选项卡tab2

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  6. HTTP请求的两种方式get和post的区别

    1,get从服务器获取数据:post向服务器发送数据: 2,安全性,get请求的数据会显示在地址栏中,post请求的数据放在http协议的消息体: 3,从提交数据的大小看,http协议本身没有限制数据 ...

  7. ORACLE中的KEEP()使用方法

    转载至:http://blog.csdn.net/aqszhuaihuai/article/details/6434160 ====================================== ...

  8. 简单的XMPP服务器与客户端交互

    由客户端发起 C: <stream:stream to="localhost" xmlns="jabber:client" xmlns:stream=&q ...

  9. jvm内存分部

    首先我们必须要知道的是 Java 是跨平台的.java常用的名词有jdk,jre,jvm jdk包括后两者,是开发者工具集, jre表示java运行环境, jvm是java虚拟机,是java夸平台的保 ...

  10. javax.jms.JMSException: Could not connect to broker URL: tcp://localhost:61616. Reason: java.net.ConnectException: Connection timed out: connect

    本地测试向服务器中ActiveMQ添加队列数据,报错连接超时 解决: 查看服务器端口号是否存在,(最好是0.0.0.0格式的,虽然暂时还不知道为啥得这个格式) 通过telnet测试该端口不通(6161 ...