css浮动和定位

CSS定位机制：
position属性拿来定位用，有四个属性。
1.static
正常默认值，不脱离文档流。
2.relative
原标签不脱离文档流，占据原有位置，偏离后的标签，会覆盖其他标签，偏离位置以标签原文档流的位置为参考坐标。
3.absolute
标签脱离文档流，偏离位置以存在position值的父元素为参考坐标，如果不存在，则以body标签为参考坐标。
4.fixed
生成绝对定位的元素，相对于浏览器窗口进行定位。
注：对于使用了position属性中非static标签的元素，使用top,right,bottom,left和z-index来设置上，右，下，左和重叠优先级。非position属性的标签会忽略这5个属性。

z-index详解：
元素可拥有负的 z-index 属性值。
该属性设置一个定位元素沿 z 轴的位置，z 轴定义为垂直延伸到显示区的轴。如果为正数，则离用户更近，为负数则表示离用户更远。

float
浮动的问题：
1.父元素的高度无法被撑开，影响与父元素同级的元素
2.与浮动元素同级的非浮动元素会跟随其后
3.若非第一个元素浮动，则该元素之前的元素也需要浮动，否则会影响页面显示的结构
float存在四个值，left,right,none,inherit默认是none.
浮动元素会生成一个块级框。(不会换行，除非空间不够。)
如果浮动非替换元素，则要指定一个明确的宽度；否则，它们会尽可能地窄。
设置float会使得标签脱离普通文档流，直到它的右边缘碰到包含框的右边缘，使得块级元素会无视标签的位置，而产生重叠的现象，然而文字却不会无视浮动，会围绕在浮动周围，具体浮动的位置要看浏览器的渲染情况，如第一个元素为块级元素，第二位右浮动元素，则右浮动元素会存在第二行。
clear
clear存在属性值为none,left,right,both.
clear存在是为了清除浮动，注：清除浮动时，添加clear属性只能对自己有效。
到底是清除左边还是右边，则需要查看下，浏览器渲染的顺序。

overflow
取值一般为hidden和scroll。
scroll：内容会被修剪，但是浏览器会显示滚动条以便查看其余的内容。
hidden：内容会被修剪，并且其余内容是不可见的。
visible：默认值。内容不会被修剪，会呈现在元素框之外。

placeholder
在文本框中存在一个默认值，获得焦点的时候消失。