一.选择器
1.class选择器 .class
2.ID选择器 #id
3.标签选择器 p div等标签
4.属性选择器 input[href = "http://"] a[href^="#"]
5.伪类选择器 :hover :checked :first-child
6.伪元素选择器 :before :after
7.组合选择器
(1)后代选择 A B 选中B，如果它是A的子孙
AB 如果不用空格间隔，则选中既有A选择器又有B选择器的元素
(3)亲子选择 A>B 选中B，如果它是A的子元素
(4)兄弟选择器 A~B 选中B，如果它在A后面且和A同级
(5)相邻选择器 A+B 选中B，如果它紧跟在A后面
选择器的优先级
!important >内联样式(style) > id选择器 > 类选择器(例如，.example)，属性选择器（例如，[type="radio"]）和伪类（例如，:hover） > 标签选择器(包括伪元素选择器,例如 p div ::before ::after等)
二.具体属性
1.颜色
rgb （red green blue）（124，43，134）
#后面加六位写的颜色是rgb的缩写 转16进制
hls（20，51%，51%）
2.font-family
字体一般前面放英文字体，后面放中文字体，因为中文除了26个中文字母外还有汉字，中文放前面就全部覆盖了。
此外font-family最后一个属性是字体族属性，通常字体系列名称：比如："serif"、"sans-serif"、"cursive"、"fantasy"、"monospace。指定文字风格，当前面文字都没有时。
引入汉字时可以优化使用,汉字文件包比较大，只导出需要的文字。
3.font-size 属性
使用百分比及em时，是相对父级元素文字大小的百分比。
4.line-height(上下两行文字基线间距离)
当line-height是数字时，例:那么行高为32px 1.6*20
p{
font-size:20px;
line-height:1.6;
}
5.text-align
可选 left center right justify（两端对齐，文字比较好看）
5.clip切割属性
clip: rect(20px,auto,auto,0) 注意一点，应用clip属性的元素必须得是绝对定位，position:absolute
6.可继承的属性
font-size,color,cursor,line-height,text-align,letter-spacing等一般是文字的属性
7.属性
inherit(继承) initial(最初的) unset: 使用unset时，如果某个属性，父元素有定义，且子元素能够继承时，则子元素属性值会被设置为继承的值。如果这个属性没有继承的话，则和inital效果一致
三、布局
1.三种布局
文档流
float
绝对定位
2.padding，margin的百分比是相对于元素容器（父元素）宽度的，不管是哪个方向的。所以做一个正方形容器可以用vh，vw。也可以用padding-top:100%。
.test{
width: 20%;
height: 0;
background: red;
padding-top: 20%;
}
3.行级排版上下文IFC
4.块级排版上下文BFC
5.flex布局
默认子元素不设置的时候是 flex 0 1 auto
设置的时候：
