选择器

选择器类型 {
    css属性名:  css属性值;
}

  标签选择器

  通配符 *
  重置标签的默认样式

  class选择器
  .名字


  id选择器
  #名字 

  一般用在js上
  id="login"


  伪类选择器


  定位：position
  作用：实现各种复杂布局的

    1：相对定位 relative
       如果元素被设置了相对定位，

       那么它会脱离文档流，
       但原本位置不会被删除
       他的定位参考对象是原本的位置(左上角)

    2：绝对定位 absolute

       那么它会脱离文档流，
       原本位置被删除了
       他的定位参考对象是原本的位置 
         1: 如果该元素的父容器设置了定位，那么参考父容器来定位
         2: 如果该元素的父容器没有设置定位，那么参考浏览器边框定位

    3：固定定位  fixed
        那么它会脱离文档流，
        原本位置被删除了
        参考浏览器边框定位


    4：普通定位（流式定位）


两种方案让元素横着排列：

1:
display: inline-block;
         inline
         block

2: float 浮动        


盒子模型：

margin（外边距） padding（内边距） border（边框） content（内容）

padding: 10px;
padding: 10px 20px;
padding: 5px 30px 20px;
padding: 10px 20px 30px 40px;

padding-left: 10px;
padding-right: 10px;
padding-top: 10px;
padding-bottom: 10px;

真实宽高 = content 宽高 + padding（内边距）+ border（边框）


box-sizing: border-box;
200x200 = content 宽高 +  padding（内边距）+ border（边框）