zoukankan      html  css  js  c++  java
  • CSS 28 块之间的空格

     步骤 1 : 

    块之间有空格

    如果多个span连续编写,像这样:
     
    <span>连续的span</span><span>连续的span</span>
     
    
    是不会有空格的
    但是真正开发代码的时候,一般不会连续书写span,而是不同的span之间有回车换行,比如这样:
     
    <span>有换行的span</span>
    <span>有换行的span</span>
    <span>有换行的span</span>
     
    
    而这样编写代码,就会导致<span>之间出现空格
    <style>
    span{
    border-bottom:2px solid lightgray;
    }
    </style>
     
    <div class="continue">
    <span>连续的span</span><span>连续的span</span><span>连续的span</span><span>连续的span</span>
    </div>
    <div class="nocontinue">
    <span>有换行的span</span>
    <span>有换行的span</span>
    <span>有换行的span</span>
    </div>

     步骤 2 : 

    解决办法

    使用float来解决。
    float使用完毕之后,记得在下面加上 <div style="clear:both"></div> 用于使得后续的元素,不会和这些span重复在一起

    <style>
    div.nocontinue span{
    border-bottom:2px solid lightgray;
      float:left;
    }
    </style>
      
    <div class="nocontinue">
    <span>有换行的span</span>
    <span>有换行的span</span>
    <span>有换行的span</span>
    </div>
     
    <div style="clear:both"></div>
     
    <div>后续的内容</div>

  • 相关阅读:
    Python列表去重的三种方法
    关于Python的 a, b = b, a+b
    Python爬取B站视频信息
    Linux文件管理命令
    (一)MySQL学习笔记
    Linux特殊字符含义
    在父容器div中图片下方有一条空隙问题
    对Json的各种遍历方法
    for循环使用append问题
    IE兼容性
  • 原文地址:https://www.cnblogs.com/JasperZhao/p/13307716.html
Copyright © 2011-2022 走看看