一、CSS选择器
选择器权重小结：
- 权重决定了哪一条规则会被浏览器应用在元素上。
- 权重的不同，是所期望的效果，没有通过css规则在元素上生效的主要原因。
- 权重的级别划分时包含了所有的css选择器
- 如果两个选择器作用在同一元素上，则权重高者生效。
- 权重的级别根据选择器被划分为四个分类：行内样式，id，类与属性，以及元素。
- 如果两个选择器权重值相同，则最后定义的规则被计算到权重中(后面定度的CSS规则权重要更大，会取代前面的CSS规则)
- 如果两个选择器权重值不同，则权重大的规则被计算到权重中
- 如果一条规则包含了更高权重的选择器，那么这个规则权重更高
- 最后定义的规则会覆盖所有跟前面冲突的规则
- 内联样式表含有比别的规则更高的权重
- Id选择器的权重比属性选择器更高
- 可以使用id来增大权重
- 类选择器比任意数量的元素选择器都高
- 通配符选择器跟继承来的样式，他们的权重以 0，0，0，0来计算
- 可以用css权重计算器来计算权重。
权重等级：
每个选择器在权重级别中都有自己泾渭分明的位置。根据选择器种类的不同可以分为四类，也决定了四种不同等级的权重值。
1、行内样式，指的是html文档中定义的style
行内样式包含在你的html中 对你的元素产生直接作用，比如:
<p class="xml" style="color:red">CSS权重</p>
2、ID选择器
Id也是元素的一种标识，比如#div
3、类，属性选择器和伪类选择器
这一类包括各种class，属性选择器，伪类选择器比如 :hover,:focus等等。
4、元素和伪元素
元素跟伪元素选择器，比如:before 与 :after.
怎么确定权重：
权重记忆口诀。从0开始，一个行内样式+1000，一个id+100，一个属性选择器/class或者伪类+10，一个元素名，或者伪元素+1
二、浮动
浮动的作用：
可以使多个块级元素横向排列，多用于网页布局。
浮动方法：
为元素添加float:left/right;
浮动特征：
1.按照一个指定的方向移动，遇到父级的边界或者其他的元素停下来
2.块元素可以在一行显示，宽由内容撑起来
3.行内元素支持设置宽高
4.脱离文档流 float不是完全脱离文档流的
块元素 ：对于块元素，后面未浮动的元素所占的位置是浮动元素的位置 注意：内容会把浮动元素的位置保留，
行内元素：行内元素会接着浮动元素显示，内容会形成环绕浮动元素的样子
5.造成父级塌陷(破坏性)
清除浮动方法：
1.结尾处加空div标签 clear:both （或在下一个元素上加clear:both;）
2.父级div定义 伪元素:after（content: " "; clear: both; display: block;）
3.父级div定义 overflow:hidden
三、定位
定位方法一共有三种：
display:fixed;/*固定定位，相对浏览器定位*/
display:relative;/*相对定位，相对自己原来的位置定位*/
display:absolute/*绝对定位，相对父类盒子定位*/
固定定位：
默认情况下，可定位于相对于浏览器窗口的指定坐标。元素的位置通过 “left”, “top”, “right” 以及 “bottom” 属性进行规定。不论窗口滚动与否，元素都会留在那个位置。但当祖先元素具有transform属性且不为none时，就会相对于祖先元素指定坐标，而不是浏览器窗口。
相对定位：
生成相对定位的元素，相对于该元素在文档中的初始位置进行定位。通过 “left”、”top”、”right” 以及 “bottom” 属性来设置此元素相对于自身位置的偏移，偏移前的位置保留不动。
绝对定位：
其他元素就会认为这个元素不存在于文档流中而填充它原来的位置。绝对定位元素根据它的参照物移动自己的位置，而参照物则需要根据它祖先元素的定位设置来确定。
所谓根据它祖先元素的定位设置来确定简单理解为：相对于该元素最近的已定位的祖先元素，如果没有一个祖先元素设置定位，那么参照物是body层。
