美文网首页
inline-block布局元素间距的消除

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

作者: Dorazzz | 来源:发表于2017-10-12 20:07 被阅读0次

    间距产生

    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/

    相关文章

      网友评论

          本文标题:inline-block布局元素间距的消除

          本文链接:https://www.haomeiwen.com/subject/sqeoyxtx.html