float元素有什么特征：
1.浮动元素会脱离正常的文档流，按照其外边距指定的位置相对于它的上一个块级元素（或父元素）显示
2.浮动元素后面的块级元素的内容会向此浮动元素的外边距靠齐，但是边框和背景却忽略浮动元素而向上一个任意非浮动元素靠齐
3.浮动元素后面的内联元素会向此浮动元素的外边距靠齐
float造成的影响：
对其父元素的影响：
对于其父元素来说，元素浮动之后，它脱离当前正常的文档流，所以它也无法撑开其父元素，造成父元素的塌陷
对其兄弟元素（非浮动）的影响：
如果兄弟元素为块级元素，该元素会忽视浮动元素的而占据它的位置，并且元素会处在浮动元素的下层（并且无法通过z-index属性改变他们的层叠位置），但它的内部文字和其他行内元素都会环绕浮动元素。
如果如果兄弟元素为内联元素，则元素会环绕浮动元素排列。
对其兄弟元素（浮动）的影响
同一个方向的浮动元素：当一个浮动元素在浮动过程中碰到同一个方向的浮动元素时，它会紧跟在它们后面
反方向的浮动元素：互不影响，位于同一条水平线上，当空间不够时会被挤下
对子元素的影响
当一个元素浮动时，在没有清除浮动的情况下，它无法撑开其父元素，但它可以让自己的浮动子元素撑开它自身，并且在没有定义具体宽度情况下，使自身的宽度从100%变为自适应（浮动元素display:block）。其高度和宽度均为浮动元素高度和非浮动元素高度之间的最大值。
对文字的影响：
其相邻文本元素只会环绕图片排列并不会跑到图片的下方和上方
清除浮动指的是什么：
清除浮动指的是清除掉浮动的影响
如何清除浮动：
1.给予父级容器样式
父级元素:: after {
content：‘’；
display：block;
clear:both
}
2.在浮动的父级元素下方建立一个空的div并给予样式
{
clear:both;
}
3.活在在浮动元素最后建立一个空的div，如果是元素是左浮动，给予div样式
{
clear:left
}
,如果是右浮动，给予样式{
clear:right
}
clear:left;
clear:both;
box::after{
content:'';
clear:both;
display:block;
}
position:absolute->父容器fixed,relative,absolute,没有继续往上，否则就是html
relative,fixed不保留原先的位置
定位：
1.absolute生成相对于的绝对定位的元素，相对于 父级的是否有position这个属性进行定位（如果没有，就往*上找他的父级的父级，一直到html）。
2.fixed生成绝对定位的元素，相对于浏览器窗口进行定位。
3.relative生成相对定位的元素，相对于其正常位置进行定位。
他们都是通过 "left", "top", "right" 以及 "bottom" 属性进行规定。
使用场景：
都是一些脱离文档流，在页面不规则的位置出现的元素可以使用，比如，头像上面的消息信息数量，购物车上面的数量（absolute,absolute结合relative使用），回到首部按钮，侧边固定栏（fixed）
z-index
z-index作用：
1.可以解决元素的覆盖问题，决定那个元素在上方，哪一个在下方；
2.z-index的值可以是负数，也可以为0，也可以无群大，数值大的在上方；
3.z-index父元素设置的值权重比较大，当两个父元素相比的时候，父元素起决定作用，其中的子元素设置多大都没有用；
网友评论