定位
position属性来定义，他是相对于上级定位的，position也分relative相对定位和absolute绝对定位，默认是没有定位的。如果用position布局页面的话，使用left、top、left、bottom属性并设置以px为单位的值，如果嵌套的话可以使用，父级相对定位，子级绝对定位，俗称父相子绝。
上面所述relative相对定位是在当前文档流中，而fixed固定定位和absolute绝对定位则脱离当前文档流。脱离当前文档流后可以使用z-index调整得放顺序。
relative 对象遵循正常文档流
absolute 对象脱离正常文档流，使用top，right，left，bottom等属性进行绝对定位。如果不指定父级定位容器，将以浏览器窗口进行定位。
fixed 对象脱离正常文档流，使用top，right，left，bottom等属性以浏览器窗口为参考点进行定位，当出现滚动条是， 对象不会随之滚动。
浮动
float属性来定义，用于设置标签的左右浮动，浮动后的元素不在当前文档流中，需要清除浮动才能回到当前文档流，float的值 left左浮动，right右浮动。
浮动产生的影响：
1.自身的父元素无法获取宽高
2.后续的元素会自动补位
3.浮动会脱离当前文档流，覆盖标准流的元素
4.auto会失效
5.块元素可以横排显示(失去独占一行的特性)
6.行元素可以设置宽度和高度
7.除了auto以外，依然支持margin
8.提升半个层级 z-index
清除浮动的常见方法有以下几种：
1. 给父级设定宽高
缺点： 父级如果作为容器，直接就写死了，后续元素添加会出问题，而且无法解决元素重叠的问题 不推荐使用！ 了解即可
2. 使用overflow ：hidden 属性 (超出内容区域的部分，隐藏。给父元素添加
缺点：如果内容需要超出，或者较多时.需求发生冲突
如果内容没有超过，推荐使用。 较为方便
适用场景： 浮动元素较少.
3. 使用clear: both 属性;
clear: 是否允许浮动
left: 不允许左侧有浮动
right: 不允许右侧有浮动
both: 不允许两侧有浮动
缺点： 需要写一个空标签来绑定 clear属性. 这个空标签没有html的作用，不符合html标签语义化
4. 给父级设置 display: inline-block;
缺点: 父元素的同级之间会留有间隔
display
display默认属性为block，称为块元素，line为行元素，line-block为行内块元素，none影藏对象
块元素无论多大占一行，行元素只占自身大小位置。
