CSS定位

概述
通过定位属性，可以精准的控制元素在网页中的位置。 属性名：position，下表为可选值。
可选值 解释
relative 即相对定位，相对于原文档流的位置进行定位
absolute 即绝对定位，相对上一个已经定位的父元素进行定位
fixed 即固定定位，相对于浏览器窗口进行定位
static 即静态定位（默认值)
1.相对定位relative
相对定位relative是相对于元素自身在原文档流的位置定位，配合top/bottom和left/right使用。
相对定位
	
#position_test1 {
	position: relative;
	left: 30px;
	top: 15px;
}
2.绝对定位absolute
绝对定位absolute是相对于离自己最近的具有定位属性的父元素的偏移。
绝对定位
	
#position_test2 {
	position: absolute;
	left: 30px;
	top: 15px;
}
3.固定定位fixed
固定定位fixed是相对于浏览器窗口的定位。
固定定位
	
#position_test3 {
	position: fixed;
	right: 30px;
	bottom: 15px;
	z-index: 999;
}
4.静态定位static
静态定位static是所有元素的默认定位方式，当position属性的取值为static时，可以将元素定位于静态位置。所谓静态位置就是各个元素在HTML文档流中的默认位置。
静态定位
	
#position_test4 {
	position: static;
	left: 30px;/* 静态定位时无效 */
	top: 15px;/* 静态定位时无效 */
}