css3 通过标准流, 浮动流,定位这三种就可以实现基本还原页面的效果 。
今天讨论在工作中常常遇到的定位问题
定位模式:position :static静态定位(就是没有定位,如 border:none,也就是标准流的格式写法)
position:relative 相对定位
position:absolute 绝对定位(不占位,根据定位随意偏移)
position:fixed 固定定位
边偏移: top,bottom,left,right属性定义元素的偏移量。
relative:在自己的位置上去偏移position:relative;left:20px;top:20px;
以自己的左上角位置,向左走20px;向上走20px;
特殊的地方:移动后自己原来的位置占有,后面的布局保持在以前的位置(如同:自己出差,房子还是自己的,邻居还住在对面,邻居不会住在自己的家中)
absolute:position:absolute; top:20px;left:20px
*若父亲(爸爸,爷爷…)没有定位的情况下,以浏览器为窗口的定位去走偏移量 父亲(爸爸,爷爷…)元素有position:relative;则子元素的定位偏移量就以找到第一个父亲为偏移量 *
口诀:父亲相对,子绝对最合适