inline-block布局元素间距的消除

2017-10-12  本文已影响0人  Dorazzz

间距产生

1.真正意义上的inline-block水平呈现的元素间,换行显示或空格分隔的情况下会有间距

2.当一个元素被定义为inline-block时,就会具有块级元素和行级元素的属性,会受width、height、line-height等属性的影响

间距消除

1.利用css的方法,对定义了inline-block的父元素,定义font-size:0

2.在方法1的基础上,考虑浏览器的兼容,全兼容的使用方法:

      对定义了inline-block的父元素,定义font-size:0,并使用letter-space:-N px来兼容safari,

现象表示

对【进入页面姿势不对】的错误文本信息,设置inline-block,作用于区域异常大 对父元素定义font-size:0后表示正常 相关的设置代码

相关文档说明:

http://www.w3cplus.com/css/fighting-the-space-between-inline-block-elements

http://www.51xuediannao.com/html5/984.html

http://www.zhangxinxu.com/wordpress/2012/04/inline-block-space-remove-%E5%8E%BB%E9%99%A4%E9%97%B4%E8%B7%9D/

上一篇下一篇

猜你喜欢

热点阅读