1.css背景样式
background-color 背景色
background-image 背景图
url（背景地址）
默认水平垂直都铺满
background-repeat 平铺方式
repeat-x
repeat-y
repeat（x，y都平铺）
no-repeat 都不平铺
background-position ：背景位置
x y：number|单词
x : left,center,right
y：number : top,center,bottom
background-attachment : 背景图随滚动条移动的方式
scroll ：默认值（背景位置是按照当前元素进行偏移的）
fixed ：（背景位置是按照浏览器进行偏移的）
2.css边框样式
border-style ：边框样式
solid : 实线
dashed ：虚线
dotted : 点线
border-width ：边框大小
px ...
border-color : 边框颜色
red #f00000 ...
边框也可以针对某一边进行单独设置 ：border-left-style：中间是方向 left、right、top、bottom
颜色：透明色 transparent
3.css文字样式
font-family ：字体类型
英文、中文
衬线体、非衬线体
注意点：
1.多个字体类型设置的目的
2.引号添加的目的
font-size ：字体大小
默认大小 ：16px
写法 ：number（px） small
注：字体大小一般为偶数
font-weight ：字体粗细
模式 ： 正常（normal） 加粗（hold）
写法 ：单词（normal、hold） | number（100 200.。。900，100-500为正常，500-900为加粗）
font-style : 字体样式
模式： 正常（normal）斜体（italic）
写法：单词（normal、italic）
注：oblique也是表示斜体、一般了解即可
color ：字体颜色
4.css段落样式
text-decoration : 文本修饰
下划线 ：underline
删除线 ：lne-through
上划线 ：overline
不添加任何装饰 : none
注： 添加多个文本修饰：line-through underline overline
text-transform : 文本大小写 （针对英文段落）
小写： lowercase
大写： uppercase
text-indent : 文本缩进
首行缩进
em单位：相对单位，1em永远都跟字体大小相同
text-algin ：文本对齐方式
对齐方式：left、right、center、justify（两端对齐）
line-height : 定义行高
什么是行高，一行文字的高度，上边距和下边距的等价关系。
默认行高：不是固定值，而是变化的，根据当前字体的大小在不断的变化。
取值：1、number（px） | scale（比例值，跟文字大小成比例的）
letter-spacing : 字之间的间距
word-spacing : 词之间的间距（针对英文段落）
英文和数字不自动折行的问题：
1.word-break : break-all;(非常强烈的折行)
2.word-wrap ：break-word;(不是那么强烈的折行，会产生一些空白区域)
5.css复合样式
复合样式的写法，是通过空格的方式实现的，复合写法有的是不需要关心顺序，例如background、border；有的是需要关心顺序，例如font。
1. background ：red url() repeat 0 0;
2. birder : 1px red solid;
3. font :
注：最少要有两个值 size family
weight style size family √
style weight size family √
weight style size/line-height family √
注：如果非要混合去写的话，那么要先写复合样式，再写单一样式，这样样式才不会被覆盖掉。
6.css选择器
1. ID选择器
#elem{} id="elem"
注：
1.ID是唯一值，在一个页面中只能出现一次，出现多次是不符合规范的
2.命名的规范，由字母、下划线、中划线、字母（并且第一个不能是数字）
3.驼峰写法：searchButton（小驼峰） SearchButton（大驼峰
短线写法：serch-button
下划线写法：search_button
2. CLASS选择器
.elem{} class="elem"
注：
1.CLASS选择器是可以重复使用的
2.可以添加多个class样式
3.多个样式的时候，样式的优先级根据css决定，而不是class属性中的样式
4.标签+类的写法
3.标签选择器
div{} <div></div>
使用场景：
1.去掉某些标签的默认样式时
2.复杂的选择器中，如 层次选择器
4.群组选择器（分组选择器）
可以通过逗号的方式，给多个不同的选择器添加统一的CSS样式，来达到代码的复用
5.通配选择器
*{ } -> div，ul，li，p，h1，h2.....{}
注：尽量避免使用通配选择器，因为会给所有的标签添加样式，慎用。
使用场景：
1.去掉所有标签的默认样式时
6.相邻选择器
后代 M N{ }
父子 M>N{ }
兄弟 M~N{ } 当前M下面的所有兄弟N标签
相邻 M+N{ } 当前M下面相邻的N标签
7.属性选择器
M[attr] {}
= : 完全匹配
*= ：部分匹配
^= ：起始匹配
$= ：结束匹配
[][][] : 组合匹配
8.伪类选择器
M:伪类{}
：link 访问前的样式 (只能添加给a标签)
：visited 访问后的样式 (只能添加给a标签)
：hover 鼠标移入时的样式 (可以添加给所有的标签)
：active 鼠标按下时的样式 (可以添加给所有的标签)
注：
一般的网站都只设置
a{} {link visited active} a:hover{}
：after、：before 通过伪类的方式给元素添加一段内容，使用content属性
：checked、：disabled、：focus 都是针对表单元素的
结构性伪类选择器
nth-of-type() nth-child()
角标是从1开始的，1表示第一项，2表示第二项 | n值 表示从0到无穷大
first-of-type
last-of-type
only-of-type
nth-of-type() nth-child()之间的区别
type ：类型
child ：孩子
7.css继承
文字相关的样式可以被继承
布局相关的样式不能被继承（默认是不能继承的，但是可以设置继承属性inherit值）
8.css优先级
1.相同样式优先级
当设置相同样式时，后面的优先级较高，但不建议出现重复设置样式的情况
2.内部样式与外部样式
内部样式与外部样式优先级相同，如果设置了相同样式，那么后写的引入方式优先级高。
3.单一样式优先级
style行间 > id > class > tag > * > 继承
注：style行间 权重1000
id 权重100
class 权重10
tag 权重1
4.!important
提升样式优先级，非规范方式，不建议使用。(不能针对继承的属性进行优先级的提升)
5.标签+类与单类
标签+类 > 单类
6.群组优先级
群组选择器与单一选择器的优先级相同，靠后写的优先级高
7.层次优先级
1.权重比较
ul li .box p input{ } 1+1+10+1+1
.hello span #elem{ } 10+1 +100
2.约分比较
ul li .box p input{} li p input{}
.hello span #elem{ } #elem{}
