zoukankan      html  css  js  c++  java
  • 去除inline-block元素间间距

    根本原因:inline-block元素之间之所以有空白间距是因为空格有字体大小原因。

     

    第一种:

      把代码之间的换行空白都去掉。

          例如:

         <div>第一个inline-block元素</div><div>第二个inline-block元素</div>


    第二种:
      

      把inline-block元素用一个大的div包起来,然后设置其字体大小为0即可,inline-block元素字体大小再单独设置。

      例如:

         <div style=”font-size:0" class="space">
              <div>第一个inline-block元素</div>
              <div>第二个inline-block元素</div>
         </div>


    这个方法,基本上可以解决大部分浏览器下inline-block元素之间的间距(IE7等浏览器有时候会有1像素的间距)。不过有个浏览器,就是Chrome, 其默认有最小字体大小限制,因为,考虑到兼容性,我们还需要添加:
     

    类似下面的代码:

    .space {

        font-size: 0;

        -webkit-text-size-adjust:none;

    }

  • 相关阅读:
    第八周作业
    第八周上机练习
    第七周上机练习
    第六周作业
    第六周上机练习
    第五周上机练习
    第四周作业
    第四次上机作业
    第三周作业
    第一次上机作业
  • 原文地址:https://www.cnblogs.com/ranyonsue/p/6148264.html
Copyright © 2011-2022 走看看