浮动出现，悬浮隐藏，出现窗口

浮动

浮动是为了网页布局 浮动块标签是为了块标签完美的在一行排列

/* 左浮动 */            右浮动
    float: left;   			float: right;

文档流: 包含元素的布局宽高背景颜色等等

文本流: 包含文字元素内容

  左浮：不脱离文本流，脱离文档流 
  右浮：脱离文本流，脱离文档流

浮动的作用

1. 浮动标签会脱离标准流的控制，不在占用标准流的位置
2. 浮动元素比标准流高半个级别，可以覆盖标准流中的元素（意思就是我能盖你的标签，但不能盖你的字啊）
3. 浮动找浮动，下一个浮动元素会在上一个元素后面左右浮动
4. 浮动的标签是顶对其的
5. 浮动：在一行排列，宽高生效 – 浮动后的标签具备行内块特点
6. 浮动的元素有特殊的显示效果
   1. 一行可以显示多个浮动标签
   2. 可以设置宽高

注意（CSS书写顺序）

有新添加的元素尽量在上面另起一行添加，因为浏览器执行的效率会更高

清除浮动

1. 给父容器添加高度，但不建议使用
2. 给使用的元素后添加空的块元素，添加clear：both

  style="clear：both"；

3. 通过after伪类 给他的父级添加伪类，设置content，添加display：block，然后添加clear：both

比如
.box>.ul::after {
    content: "";（为空）
    display: block; 块级
    clear: both;清浮动
}

4. 直接在父容器里添加溢出隐藏属性 overflow:hidden

 overflow:hidden;

浮动的弊端

对自身的影响都脱离了文档流，对兄弟改变了布局，对父类进行了坍塌

opacity透明度

范围（0-1）0完全透明，1完全展现

隐藏

display none
隐藏
display block
显示