# 第五章 样式汇总 1. css 三种写法 2. 选择符和样式优先级 [重点] 4. 布局相关 5. 文本相关 text-* 6. 字体相关 font-* 7. 背景相关 background-* 8. 边框 9. 列表 10. 定位 11. 案例 ## css介绍 ## css三种写法和选择符 ### 选择符高级使用 ## 选择符和css优先级 ### css优先级 行内最大! 内部和外部遵循: 就近原则 ### 选择符优先级 1. id> class > 标签 2. 连写时有权重值  ## 布局相关 1. 行块转换 2. 显示隐藏 ## font-* ## text-* ## background-* ## border-* ## list-* ## position 除了使用`盒子模型`外,还可以使用定位实现标签位置的调整.就是定位属性:position [pei zen sen] . position分三种,:相对定位,决定定位,固定定位 ``` 相对定位: position: relative 绝对定位: positon:absolute 固定定位: position:fixed 层次调整: z-index:数字 ``` ### 相对定位 相对定位,就是微调元素位置.让元素`相对于自己原来的位置,进行位置调整` 1. 特点:不脱流,原有位置保留,形影分离 2. 用途 - 微调元素 - 做绝对定位的参考,子绝父相 ### 绝对定位 1. 特点1:脱流 2. 默认参考点: 网页左上角  3. 父辈存在定位时,优先相对于离的最近的父辈定位元素定位 4. 定位子元素无视参考盒子的padding 5. 绝对定位盒子maring:0 auto;失效 7. 定位后行级标签可设置宽高 8. 定位重合用z-index调整层次 ## 浮动案例 ## 雪碧图案例 ## 列表案例 ## 导航案例 ## 定位案例 ## 总结 1. 各种样式 2. 应用案例