[TOC]
（一）层叠样式表
（1）基本用法
- CSS(Cascading Style Sheets)层叠样式表
- 作用：渲染页面；使页面的内容和表现分离
- 基本格式
- 选择器{属性1:值1;属性2：值2;} （某些值不能加上引号）
- 比如#id{样式}
- CSS和HTML的整合方式
- 内联样式表：通过HTML标签的style属性
- 内部样式表：通过head标签的style子标签导入
- 外部样式表： 有独立的CSS文件(通过link标签< link rel=”stylesheet” href=”” type=”text/css” >)，通过head标签内的link子标签导入
（2）选择器
- 选择器
- id选择器：HTML元素需要有id属性并且有值——“#id1{样式}”
- class选择器：HTML元素需要有class属性并且有值——“.class1{样式}”
- 元素选择器 ：直接使用标签（需要是HTML固有的标签）——p{样式}
- 属性选择器： 看成元素选择器的变种，首先筛选元素， 然后是特定的标签（可以使用自定义的标签）——标签[属性名称=”值”]{样式}
- 后代选择器：选择E元素后代的所有F元素—— 标签E 标签F{样式}
- 锚伪类选择器（了解）：改变鼠标移动到链接、打开链接时的颜色
- 对于Cascading层叠的理解
- 多个样式作用于一个元素时：不同的样式会叠加；相同的样式时会依照就近原则（选择离元素最近的样式）
（3）属性
- 字体
- font-family 设置字体
- font-size
- font-style
- 文本
- text-decoration（设置none让超链接不带下划线）
- color
- text-align 对齐方式
- 列表
- list-style-type
- 浮动
- float （可以让多个div放在同一行 ：left、right属性）
- clear (both属性：左右两边不能有元素)
- 尺寸
- width
- height
- 分类
- display（none会让元素不显示；block会让元素单独成块；inline会取消元素的换行）
- 背景
- background-color
- background-image（使用url设置图像背景）
- 元素框
- padding 内边距（设置多个值时按照 上右下左顺时针赋值，如果缺省则按照对称方向）
- border 边框的厚度（border-width border-style（dashed|solid…） border-color）
- margin 元素之间的距离