zoukankan      html  css  js  c++  java
  • 行内元素的特别之处

    特别之处

    1. width、height、margin-top、margin-bottom对于行内元素无效

    2. padding-top、padding-bottom对于行内元素来说有效 ,但是相当于浮动的效果,其他盒子布局还是跟正常一样,不会移动,就是行内元素已经覆盖,也不会移动(自动动手试试)(设置padding-top、padding-bottom上下会多出区域,但是不占据空间)

      <style>
          span {
              background-color: red;
              padding-bottom: 20px;
          }
      </style>
      <span>James</span>
      <div>我是其他的盒子</div>
      
    3. border-top、border-bottom也是跟padding一样的,会多出区域,但是不占据空间

    解决方案:

    上面的情况只是针对行内元素,而不是行内块级元素,所以只需要设置display:inline-block就可以了

  • 相关阅读:
    Java
    HashMap数据结构与实现原理解析(干货)
    Java
    Java
    Java
    面向对象基础
    Java
    Java
    Java
    shell脚本
  • 原文地址:https://www.cnblogs.com/xyf724/p/13456874.html
Copyright © 2011-2022 走看看