css - 新手 CSS - 两个盒子

Question

我是 CSS 新手，我试图将两个透明框放在正确的位置上（垂直对齐），我尝试了很多解决方案，但现在我被卡住了......

Answer 1

好吧，您定义问题的方式对于您尝试做什么有很多争议，因为有许多方法比其他方法更适合取决于需要。除非另有定义，否则几乎所有内容都是透明的。

例如，您可以在一个盒子里有一个盒子

<div><div></div></div>

这将使这些框出现在同一个地方。授予它你需要定义一个高度和宽度来给它一些尺寸。但在另一个之上。

还有另一个例子

<style>.layer{position:fixed;top:0;left:0;width:40px;height:40px;}</style>
<div class="layer" style="z-index:1;"></div>
<div class="layer" style="z-index:2;"></div>

就代码的编写而言，这实际上是使 2 个元素并排排列，但内联样式 z-index 将使一个在另一个之上。但是还有更多的方法我敢肯定有些我什至想不到。但总的来说，这一切都取决于你的最终需求，从长远来看，什么更适合你。

编辑 如果我通过你的评论理解你，那么你基本上想要我最初发布的第二个概念，当然改变了一点，所以它在右边而不是左边。如果是这种情况，请查看 jsfiddle.net 上的这个演示，看看这是否是您想要的。http://jsfiddle.net/hEEGd/

Answer 2

尝试将它们放入第三个容器盒中，并将其尺寸设置为：

• 高度：两个内框的高度之和（+1-2 px，如果其中任何一个有边框），

• 宽度：两个内盒宽度中的较长者（+1-2 px）。

然后为两个内盒设置“float:right”。