定位

定位

     定位    position  检索和设置对象的定位方式
            

             属性值         static     静态定位  和系统默认的一样  不能直接改变left/right/top/bottom

                           absolute   绝对定位   
                             
                                特点  脱离文档流  不占据空间
                                      参照物是当前元素有定位的父元素 如果父元素没有定位 则会逐一向上级寻找
                                      如果都没有定位  会根据整个文档

                           relative   相对定位
                               
                                特点  不脱离文档流   占据空间
                                      参照物是自己

                            fixed    固定定位 

             定位的步骤  1  先将元素添加 position属性 
                        2  确定参照物 
                        3  确定坐标

            包含块  就是 当前元素有绝对定位 以当前元素的父元素为参照物 给父元素添加了相对定位
                    这个父元素就是包含块  当前元素 就是包含元素 
                    给父元素添加  position：relative;
                    当前元素添加  position：absolute；


            层叠顺序    
                     后写的会覆盖前面写的

                     z-index  数字
                       数字越大  越最先显示

注意

           页面布局  
                         1   以浮动 盒模型为主 
                            
                            定位是用于图片上有文字 或 导航中的二级导航等

                         2   相对定位 不会影响元素 

                             绝对定位  会改变当前页面布局 浮动无效  左右居中 无效