一、结构伪类选择器
1.作用与优势
1.作用：根据元素在html中的结构关系找元素
2.优势：减少html中类的依赖，保持代码整洁
3.场景：用于查找某父级选择器中的子元素
2.选择器
E:first-child{} 匹配父元素中的第一个子元素，子元素为E
E:last-child{} 匹配父元素中的第一个子元素，子元素为E
E:nth-child(n){} 匹配父元素中的第n个子元素，子元素为E
E:nth-last-child(n){} 匹配父元素中倒数的第n个子元素，子元素为E
括号里面除了填写阿拉伯数字也可以填写常见公式
偶数：2n （n的数值从0开始）
奇数：2n+1 （n的数值从0开始）
找到前5个：-n+5 （n的数值从0开始）
找到从第5个往后：n+5 （n的数值从0开始）
二、伪元素
一般页面中的非主体内容可以使用伪元素（一般用于装饰性的不重要的小图）
伪元素：（ ：：before 作用：父元素内容的最前添加一个伪元素）
：：after 作用： 父元素内容的最后添加一个伪元素 ps：.
.father::before{
content:"老鼠"；
}
.father::after｛
content:"大米";
｝
<div class="father">爱</div>
最终显示老鼠爱大米三、标准流
又称文档流，浏览器渲染网页内容的一种默认排版规则。
四、浮动
浏览器解析行内块或者行内代码时，标签换行会有一个默认的外边距。
1.1作用
1.1.1早期：图文环绕
1.1.2现在：网页布局
2.1特点
2.1.1浮动元素会脱离标准流的控制，不再占用标准流位置。
2.1.2浮动比标准流高半个级别，可以覆盖标准流中的元素。
2.1.3浮动找浮动，下一个浮动元素会在上一个浮动元素左右。
2.1.4浮动元素有行内块标签特点。
css书写顺序：（浏览器执行效率会更高）
1.浮动/display
2.盒子模型：margin，border，padding，宽高背景色
3.文字样式
五、清除浮动
作用：清除浮动标签给别的标签带来的影响。
原因：子元素浮动后脱标--不占用文档位置。
目的：需要父元素有高度，从而不影响别的元素。
1.额外标签法：在父元素的最后子元素后加一个块标签，style为.clearfix{clear:both;}
2.单伪元素清除法：(和额外标签法原理一样) .clearfix::after{
content:"";
display:block;
clear:both;
为了兼容（ie6-7-8）可加
height:0;
visibility:hidden;
}
3.双伪元素清除法（真正清楚浮动的标签）
.clearfix::before, /*解决外边距塌陷问题（父子标签，都是块级，子级加margin会影响父级位置）*/
.clearfix::after{
content:"";
display:block;
clear:both;
｝
4给父元素设置 .overflow:hidden
