绝对定位（absolute）：
当一个DIV块的位置被定义为绝对定位的时候，也就意味着它失去了文档流的位置，后面的文档流会紧跟着补上来接替它的位置。如果上下左右的绝对偏移量都是零，那么它将漂浮在原来的位置上。否则就会以浏览器的上下左右四边为基准进行偏移。
相对定位（relative）:
当设了相对的偏移量之后，这个DIV原来所占据的位置（文档流）不会被下面的DIV块挤占，而是空在那里；当偏移后向下或者向右的内容会被隐藏，而 这一点区别于绝对定位，绝对定位会出现滚动条。但是向左或者向右的内容超出当前浏览器的视线，无论是相对还是觉得定位，超出的部分都会被隐藏。
注意，在使用相对定位时，无论是否进行移动，元素仍然占据原来的空间。因此，移动元素会导致它覆盖其它框。
绝对定位(absolute)：将被赋予此定位方法的对象从文档流中拖出，使用left，right，top，bottom等属性相对于其最接近的一个最有定位设置的父级对象进行绝对定位，如果对象的父级没有设置定位属性，即还是遵循HTML定位规则的，则依据body对象左上角作为参考进行定位。绝对定位对象可层叠，层叠顺序可通过z-index属性控制，z-index值为无单位的整数，大的在最上面，可以有负值(目前负值FF不支持)。
绝对定位使元素的位置与文档流无关，因此不占据空间。这一点与相对定位不同，相对定位实际上被看作普通流定位模型的一部分，因为元素的位置相对于它在普通流中的位置。
普通流中其它元素的布局就像绝对定位的元素不存在一样：
做一下修改：
#left{ float:left; width:30%; height:100%; background:#eeeeee;
margin-left:12px;
}
margin-left:12px;设置“left”左边界离左的距离,设置这个是为了让你左边的div不紧贴左边
#right{ float:right; width:68%; height:100%; background: #eeeecc}
你使用的是二列自适应宽度布局,改你的width为68%是因为你原来的70%是你上层div的总大小的70%，left设置了边界（边界+填充+内容+边框=div总宽）所以left标签的总width已经大于30%，故还要改下right的width
不懂继续问，你这种二列布局有4种方法可以讲给你
可以用position属性来进行定位
<html>
<head>
<style type="text/css">
2{position:absolute;top:20px;left:30px;}
#contain{position:relative;}
</style>
<body>
<div id="contain">
<div class="1"></div>
<div class="2"></div>
</div>
</body>
</head>
</html>
以上就是关于HTML中DIV的相对定位与绝对定位全部的内容，包括:HTML中DIV的相对定位与绝对定位、DIV内的DIV如何定位、html div定位等相关内容解答，如果想了解更多相关内容，可以关注我们，你们的支持是我们更新的动力！
欢迎分享，转载请注明来源：内存溢出
微信扫一扫
支付宝扫一扫
评论列表（0条）