css

选择器

1.内联样式

2.id选择器

3.类选择器

4.元素选择器

5.子元素选择器

样式表

1. width宽度

2. height高度

3. background 背景色

   1. 十六机制
   2. rgb
   3. 直接颜色表示
   4. rgba （透明度）

4. 单位

   1. px 像素
   2. % 百分比
   3. em 父元素的front_size
   4. rem HTML元素的front-size
   5. vw 参照游览器宽度百分比
   6. vh参照游览器高度百分比

5. marign 外边距

   一个值 上下左右

   两个值 上下 左右

   四个值 上 右 下 左

   也可以单独写

   margin-left

   margin-top

6. boder 边距

   1. 大小 样式 颜色

      1. 样式

         solider 实现

         dashed 虚线段

         dotted 点线段

         inset 3D效果

         outset 3D效果

      2. 也可以单独调整每条边

7. padding 内边距

   一个值 上下左右

   两个值 上下 左右

   四个值 上 右 下 左

   也可以单独写

   padding-left

   padding-top

8. 块元素大小

   1. 宽度 = width+左内+右内+左边+右边

   2. 高度 = height+上高+下地+上边+下边

9. box-size 设置为content-size 是在宽和高之外加

   border-box 一旦元素设置为 border-box 则该元素的内边距和边框线 都会在 width和height以内进行绘制

10. display

    1. block 块
    2. inline 行
    3. inline-block 行内块
    4. none 隐藏并脱离文档

11. float 浮动

    1. 默认成为inline-block 脱离文档
    2. left 左浮动
    3. right右浮动
    4. clear 清除浮动 一定要写在浮动的元素的同级元素上，保持浮动元素位置不变，让元素回归到文档流中

    left 清除同级中的左浮动

    right 清除同级中的右浮动

    both 清除同级中的所有浮动

12. overflow 解决溢出问题

    1. auto 一旦溢出会出现滚动条
    2. hidden 溢出的部分隐藏

定位

position 改变元素位置

1. static 静态定位 默认

定位必须伴随着属性 top left right bottom，但是在static定位上 该4个属性都是无效的

2. relative 相对定位

不脱离文档流，起点位置在元素static定位的位置上

3. absolute 绝对定位

脱离文档流，起点位置,先检查父元素是否是static,如果父元素是非static定位则起点位置参照父元素,如果父元素是static定位则继续向上找父元素直到找到了一个非static定位的父元素，如果所有的父元素都是static定位,则会参照页面的左上角

4. fixed 广告随着界面动 屏幕的绝对位置定位

覆盖规则

非static定位的元素覆盖static定位的元素

都是非static定位的情况下 后写的覆盖先写的

z-index 大的覆盖 z-index