css - 一列有两个 div，另一列有一个

Question

我会在css中放什么让一个div在另一个div之上（两个正方形都是10x10）并有另一个div是10x20的列？

让我换个说法，让它更简单一点，我想要一个 20x20 的大正方形。在该形状的左半边，它需要两个 10x10 的正方形，一个在另一个上面。在右侧，我需要一个 10x20 的 div。

请帮忙上课

Answer 1

您可以使用 css 的position属性来绝对定位元素以设置顶部和左侧坐标。您还需要使用height和width属性来调整框的大小。

Answer 2

也许是这样的？

<div id="bigBox">
     <div class="leftBox"></div>
     <div class="leftBox"></div>
     <div id="rightbox">
</div>

<style>
    #bigBox { position: relative; width: 20px; height: 20px;}
    .leftBox {position: absolute; left: 0; height: 10px; width: 10px; }
    .rightBox {position: absolute; right: 0; width: 10px; height: 20px;}
</style>