您的位置:首页 > 其它

ie6/7对display:inline-block的不支持

2015-06-23 18:51 369 查看
zoom:normal | number

设置或检索对象的缩放比例

normal:默认

number:使用对象的实际尺寸 ,浮点数1.0或者百分数100%等价于normal值

一般使用zoom:1;用来触发ie的layout属性,此外,还可以清浮动(尽量不要用这种方法清浮动)、清除margin的重叠等

1、ie6、7不支持display:inline-block

IE6能识别“*”和“_”,IE7能识别“*”

!important ie7,FF支持,ie6不支持

“\9”对IE6\7\8\9\10有效

“\0”对IE8\9\10\11有效

“\9\0”对IE9\10有效

使用hack,需要注意顺序

div{
background:red;(高级浏览器显示红色背景)
*background:green;(ie6/7显示绿色背景)
}

div{
*background:green;
background:red;(高级浏览器和ie6/7均显示红色背景:优先级问题)
}


办法一:

display:inline-block;与*display:inline;写在一起无法触发ie的layout,故需要加上*zoom:1

div{
display:inline-block;
  *zoom:1;
*display:inline; 
}


办法二:(分开写,写在同一个选择器里面无效)

div{
display:inline-block;
}
div{
*display:inline;
}


在ie下,display:inline-block只是触发了元素的layout,比如将inline-block给到div,能保证它是拥有块元素的特征(可以设置高、宽),但它还是行布局(会换行).然后设置display:inline,改变这个行布局为内联布局(不会换行)

注:{display:inline;float:left;}等同于{display:block;}
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: