我也在找怎么实现div3相对div1进行定位，之前我自己做了一个容器，让每个div3显示在div1正右边同一个位置，思路是：
每个div2和div3里面的内容都写成静态代码。
设置div3相对于div2进行独立定位position:absolute。
设置div3默认显示级别z-index:1
设置div3默认背景颜色background:#fff。
每个div3向右偏移与父div2宽度相同的数值。
每个div3向上偏移父div2相对于div1的位移值加上父div2的高度值（每个都独立设置）。
设置当鼠标移动到div2上时子div3优先显示，z-index:2。
代码如下：
<style>
.div2{width:100pxheight:30px}
.div3{position:absolutez-index:1float:leftmargin-left:100pxbackground:#fff}
.div2:hover>.div3{z-index:2}
</style>
<ul><!--div1，在这里没毛用-->
<li class="div2">番茄
<ul class="div3" style="margin-top:-30px">
<li>番茄1</li>
<li>番茄2</li>
</ul>
</li>
<li class="div2">白菜
<ul class="div3" style="margin-top:-60px">
<li>白菜1</li>
<li>白菜2</li>
</ul></li></ul>
效果如图，不知道你想要的是不是这个
有几个方法：一种：
div1设置为position：relative，
div2设置为position：absolute，
此时的div2就相对于div1进行基准定位了。。。
因为绝对定位position：absolute，不在标准流中，所以内联元素不知到他的位置，会跑到他的下面去。。。这里就看你需要什么样式了，如果简单的可以用padding和margin配合完成，让内联元素出来。。但屏幕缩小放大就变形了。。
二种，
就是你改写一下你的HTML
<div
id="div1">
<div
id="div2"></div>
</div>
把div2放到div1里面，里面设置为float，再position：relative进行浮动后地位，
这种方法比第一种好，这里看你的需求了///
平日是在须要准肯定位的情况下采取绝对定位帮助；比如一个gif带透明部分的图须要拓展到下方div又要与上方图片拼接在一路这时刻就要用绝对定位固定住地位不然浏览器大年夜小一变可能图就错位了欲望能给你赞助 查看更多答案>>希望采纳
