06-盒模型/css

#### css属性
  * 边框做三角形
    + transparent:透明属性
  ```css
  向下的三角形
  div{
    0;
    height:0;
    border-top: 20px solid red;
    border-right: 20px solid transparent;
    border-bottom:   20px solid transparent;
    border-left: 20px solid transparent;
  }
  ```
  * 鼠标样式 cursor
    + **pointer 手型**
    + help 帮助
    + not-allowed 禁止选择
    + wait 等待 
#### 盒模型
  * 内容区 content 宽高生成内容区
  * 内填充 padding:数值+px
    + 值的设置
      - 1个值 padding:20px; 四周
      - 2个值 padding:10px 20px;上下 左右
      - 3个值 padding:10px 20px 30px; 上 左右 下
      - 4个值 padding:10px 20px 30px 40px; 上 右 下 左
    + 单独方向设置 padding-方向(left/top/bottom/right)
    + padding的特点
      - padding值的设置会把盒子撑大,如果不想被撑大,要在原来的宽高的基础上减去对应方向的padding值
      - 调整子元素(内容)在父元素(盒子)内的位置  
      - 背景色可以在padding区域进行显示
      - padding值不可以设置负数
  * 边框 border 边框也会撑大盒子
  * 外边距 margin:数值+px
    + 值的设置和padding一样
    + 单方向设置
    + margin的特点
      - 不会撑大显示的区域,但是会影响到别的盒子
      - 
      背景色不在margin区域进行显示
      - margin可以设置负数
      - margin在边框的外面显示
      - 用来调整盒子到盒子之间的距离
      - margin:0 auto; 上下 左右 左右根据浏览器窗口的宽度去掉当前盒子的宽度后,左右两边平均分配
    + margin值设置的bug
      - 在一个盒子里面,当对该盒子的第一个子元素设置**margin-top**的上边距的时候,会错误的加载父元素的身上,叫做**margin的传递**
        1. 给父元素添加边框 透明的边框 
        2. **给父元素添加 overflow:hidden; 溢出隐藏**
        3. 给父元素或者该元素添加浮动
      - 给上面的盒子添加下边距,下面的盒子添加上边距的时候,会产生上下边距的重叠,取最大值显示间距
        1. 设置一个方向的间距  
原文地址:https://www.cnblogs.com/qdbj2020/p/13438199.html