float

float是指将一个标签容器浮动起来，定义元素在哪个方向浮动。以往这个属性总应用于图像，使文本围绕在图像周围，不过在 CSS 中，任何元素都可以浮动。
float会使父级高度没有撑开，从而对父级的同级产生影响。所以，使用了float，就必须要记得清除浮动。

清除浮动有三种方式：
①给父级元素加上height（该方法必须精确的知道height）
②在html中，该浮动元素的同级写上

html：
<div class = 'clearfix'></div>
css：
.clearfix{
    clear:left;//此时假设浮动的元素设置float:left;
}

③在父级增加overflow:hidden;

overflow:hidden;//超出部分被剪切还可以去掉滚动条，如：
//overflow-X:scroll;
//overflow-Y:hidden;//此时只有x轴滚动条
overflow:visible;//overflow的默认值，内容不会被修剪，呈现在元素之外
overflow:scroll;//当内容高度、宽度超出父级时，出现滚动条。但是滚动条样式是系统自带的，不可靠。
overflow:auto;

提到overflow:hidden;具有隐藏功能，visibility也是一个用来设置隐藏的方法。

visibility:visible;//默认值，可见的
visibility:hidden;//不显示内容，但标签所占的区域还在，与display:none;有区别。
visibility:collapse;//用于表格中时隐藏一行，但区域还在；用于其他地方时，作用同hidden。

position

position有三个属性值：relative(相对定位)、absolute(绝对定位)、fixed(固定定位)

position:relative;//相对自身当前的位置移动，可以对块、行级标签使用，不会改变标签属性。
left:;
right:;
top:;
bottom:;

如果没有父级标签设置position:relative;则当前标签是以body的可是区域(注意：不是body的宽高区域)为起点。
如果有父级标签设置position:relative;则当前标签是以父级标签位置为起点。

position:absolute;//此时该标签脱离文档流，改变了标签的属性，使之类似于inline-block。
left:;//此时可以设置宽高的百分比
right:;
top:;
bottom:;

固定定位，一般用于页面上类似于广告栏,不随页面滚动而滚动。

position:fixed;

z-index只有在有position属性的时候才有效，表示当前标签的层级，取值为数字，可以为负数,为负数的时候，点击事件不能被触发，如果父级有背景，则看不到该层。默认是从上往下层级递加。

position:relative;//relative、absolute、fixed都可以
z-index:999;//不可以加px等单位