当前位置：首页 → 问答吧 → 两上div重叠，一个显示上半部分，一个显示下半部分？

两上div重叠，一个显示上半部分，一个显示下半部分？

时间：2011-07-01

来源：互联网

如何让两个div重叠，一个显示上面一半（或任意高度），另一个显示下面一半（或任意高度）。
也就是截取两个div，拼成另一个div。
头痛，超出我的能力范围了，各位帮忙

作者: wildlily980 发布时间: 2011-07-01

把两个DIV放在另一个容器中，试试

作者: xuexiaodong2009 发布时间: 2011-07-01

拿两个div，接成一个不就得了，干嘛重叠

作者: aspwebchh 发布时间: 2011-07-01

一个显示上面一半（或任意高度）
bottom属性不设置。然后设置自动适应高度。

，另一个显示下面一半（或任意高度）。
top属性不设置。然后设置自动适应高度。

这样就像看起来一个DIV了
HTML code

<div style="border:1px solid red;height:100px;width:200px; border-bottom:0px white">
</div>
<div style="border:1px teal solid;height:100px;width:200px;border-top:0px white"></div>

作者: kongwei521 发布时间: 2011-07-01

你最终要实现什么效果？
要实现这个效果必须要用“两上div重叠，一个显示上半部分，一个显示下半部分？”这种方式来处理吗？

如果不是必须，可以说说你期望的效果，大家可以对你的实现方式给出更好的建议。

作者: CaiKanXP 发布时间: 2011-07-01

谢蝶恋花雨，不行，所有内容都显示出来了，而我想要的是只显示一部分。
比如上面div有1，2两行，我只要1
下面也有1，2两行，我只要2.
事情原因是我使用了一个别人东西，我无法控制这个div的输出，只能输出两个形式的样子，然后取他们的一部分合成。

作者: wildlily980 发布时间: 2011-07-01

引用 5 楼 wildlily980 的回复:

谢蝶恋花雨，不行，所有内容都显示出来了，而我想要的是只显示一部分。
比如上面div有1，2两行，我只要1
下面也有1，2两行，我只要2.
事情原因是我使用了一个别人东西，我无法控制这个div的输出，只能输出两个形式的样子，然后取他们的一部分合成。

HTML code

<style type="text/css">

#d1{ position:absolute; left:0; top:0;}
#d2{ position:absolute; left:0; top:0;}
#d1 #d1-p2{ visibility:hidden;}
#d2 #d2-p1{ visibility:hidden;}
</style>
<div id="d1">
<p id="d1-p1">d1---p1</p>
<p id="d1-p2">d1---p2</p>
</div>
<div id="d2">
<p id="d2-p1">d2---p1</p>
<p id="d2-p2">d2---p2</p>
</div>

作者: aspwebchh 发布时间: 2011-07-01

引用 6 楼 aspwebchh 的回复:
引用 5 楼 wildlily980 的回复:

谢蝶恋花雨，不行，所有内容都显示出来了，而我想要的是只显示一部分。
比如上面div有1，2两行，我只要1
下面也有1，2两行，我只要2.
事情原因是我使用了一个别人东西，我无法控制这个div的输出，只能输出两个形式的样子，然后取他们的一部分合成。

HTML code

<style type="text/css">

……

问题是我不能改变 <div>里面的内容。

作者: wildlily980 发布时间: 2011-07-01

两上div重叠，一个显示上半部分，一个显示下半部分？

热门阅读

热门下载