结构伪类选择器

1.作用与优势

1. 根据元素在html中的结构关系查找元素
2. 减少html中类的依赖，有利于保持代码的整洁
3. 常用于查找父级选择器中的子元素

选择器：

1. E：first-child(),匹配父元素第一个子元素，且是E元素
2. E:last-child()，匹配父元素最后一个子元素，
3. E:nth-child()，匹配父元素中第n个元素
4. E:nth-last-child(),匹配父元素中倒数第n个元素
5. 可以设置n达到特殊功能，偶数：2n，奇数：2n+1，找到前五个:-n+5,找到从第五个往后:n+5
6. nth-of-type(n),只在父元素中的同类型元素(E)子元素范围中,匹配第n个

伪元素

一般页面中的非主体内容可以用伪元素

区别：

1. 元素：HTML设置的标签
2. 伪元素：由CSS模拟出的标签效果

种类：

::before 在父元素内容的最前添加一个伪元素

::after 在父元素内容的最后添加一个伪元素

注意点:

1. 必须设置content属性才能生效，content里面是他的内容
2. 伪元素默认是行内元素，如果要设置宽高需要转换显示方式

标准流

又称文档流，是指浏览器在渲染网页内容的时候默认采用的一套排版规则，规定了应该以何种方式排列元素

常见标准流排版规则：

1. 块级元素：从上往下，垂直布局，独占一行
2. 行内元素或者行内块元素：从左往右，水平布局，空间不够自动拆行