首页 > 代码库 > 关于div布局的一点心得

关于div布局的一点心得

   如果是嵌套的div布局,外面的div 比如是<div  class="container"></div>这时候设置的是一个大的外框架,居中显示。我们要在里面嵌套div来

显示内容,这时候就通过<div style="display:block;position:relative"></div>来使得div标签的位置是相对于外面最靠近它的父级标签也就是<div  class="container"></div>

这样我们就可以通过设置第二级的style里面的left和top属性解决两层布局问题了,但是我们网页的布局肯定不会这么简单,至少得涉及到<div>标签的三层嵌套吧。我们现在已经知道第二级用的样式是positon:realative

但是嵌套在<div style="display:block;position:relative"></div>里面的display属性不能用realative而应该用absolute,只有这样做才能使得第三层的<div></div>的布局位置相对与第二层排布


于是困恼我多天的布局问题就解决啦。

 

基本的格式如下:

           <div class="container">

                  <div style="display:block;position:relative">


                          <div style="display:block;position:absolute" >


           

                         </div>

                  </div>  



           </div>


本文出自 “一步一步成长” 博客,请务必保留此出处http://9262494.blog.51cto.com/9252494/1537572