css 样式

高度和宽度

块级标签才可以设置宽度和高度
内联标签的宽度是由内容的长度决定
1. height
2. width

1. 字体相关
   1. font-size
   2. font-family
   3. font-weight
2. 文本相关
   1. color
      1. 直接颜色名
      2. 十六进制 --> #00FF00
      3. rgb格式 --> rgb(0,255,0)
   2. 对齐方式
      1. text-align：center --> 居中
   3. 文本装饰
      text-decoration
      none --> 去掉a标签默认的下划线
      under-line
      over-line
      line-through
   4. 首行缩进
      text-indent
3. 背景
   background: url('xx.png' no-repeat center center)
4. 边框
   border: 1px solid red
5. display
   1. none
   2. inline
   3. block
   4. inline-block
      display:inline-block引发的间隙问题解决办法(4px)？
      原因：换行或空格会占据一定的位置，从而产生间隙
      在父元素设置font-size:0
      display: none和visibility: hidden的区别？
      都是隐藏页面上的标签
      display: none隐藏标签并且不占位置
      visibility: hidden 隐藏标签的同时会占住位置
6. 盒子模型
   内容>内填充(padding)>边框(border)>外边距(margin)
7. 浮动
   1. 浮动多用于页面大范围布局
   2. 浮动
      • left 往左浮动
      • right 往右浮动
   3. 清除浮动的副作用
      1. clear
         • left 左边不能有浮动元素
         • right 右边不能有浮动元素
         • both 两边都不能有浮动元素
      2. 常用class
         .clearfix:after {
         content: '';
         display: block;
         clear:both
         }
8. 溢出
   overflow
   - hidden
   - scroll
   - auto
9. 定位
   1. 相对定位：相对 标签原来的位置 做的定位
      position: relative
      left:
      top:
      bottom:
      right:
   2. 绝对定位：相对 已经定位过的祖先标签 做的定位
      多用于页面局部的布局，注意要和定位过的祖先标签配合使用
      绝对定位和浮动一样，标签都会脱离文档，别的标签可以占用它的位置
   3. 固定定位
      固定定位相对于 屏幕 固定显示在某个位置
      固定定位的元素也是脱离文档的
10. z-index
    属性设置元素的堆叠顺序。拥有更高堆叠顺序的元素总是会处于堆叠顺序较低的元素的前面。
    Z-index 仅能在定位元素上奏效（例如 position:absolute;）！