zoukankan      html  css  js  c++  java
  • CSS---内外边距

     1、内外边距含义

    内边距是div边框内的距离。背景色会覆盖内边距,内边距会使宽高变大。

    外边距是div边框外的距离。背景色不会覆盖外边距

    内外边距都会撑高父元素,外边距会提高div与div之间的距离

     2、利用border做三角形

    给空div设置

    div{
      0;
      height: 0;
      border-top: 20px solid red;
      border-left: 20px solid transparent;  # transparent透明
      border-right: 20px solid transparent;
    }

    3、margin塌陷:

    不浮动时,在文档流里,当给两个兄弟盒子设置垂直方向上的margin,(上面的margin-bottom,下面的margin-top)

    他们俩之间的距离不是margin-bottom + margin-top 而是以最大的为准,这种现象叫margin塌陷。

    在浮动时,没有塌陷问题,距离是margin-bottom + margin-top (设置父盒子宽度,两个子盒子都向左浮动,父盒子宽度放不下

    两个子盒子时,会出现贴靠,这时不会塌陷)

    解决方式:尽量使用父元素的padding而不是子元素的margin

    4,margin:0 auto

    在某个div里写上:1,还必须写上宽度,margin:0 auto 就会水平居中盒子,   2,只有标准流下的盒子才能使用这个。 因为auto的意思是“尽可能有最大距离” 

    上下外边距为0 左右方向尽可能有最大距离就变成了对父盒子居中显示。

    这个属性不会继承(继承属性:color  font  text-* line-*)

    如果要让盒子内文字居中就要写:text-align:center

     

  • 相关阅读:
    [noip2010]关押罪犯 并查集
    双栈排序 noip2008
    欧拉函数
    中国剩余定理(孙子定理)
    求组合数
    线性素数筛
    洛谷 P2661 信息传递
    图的最短路
    Mzc和男家丁的游戏
    最佳旅游线路
  • 原文地址:https://www.cnblogs.com/staff/p/10100203.html
Copyright © 2011-2022 走看看