html - 相对于彼此定位跨度

Question

我将三个 span 元素包裹在一个容器中。我希望第一个跨度是其他两个跨度的两倍并且向左浮动。另外两个应该在第一个的左侧。但是在不同的线上，使它们垂直占据相同的高度。我尝试了很多不同的方法，但无法让它发挥作用。有谁知道我如何做到这一点？

<div id="wrapper>
  <span id="span1>text1</span>
  <span id="span2>text2</span>
  <span id="span3>text3</span>
</div>

Answer 1

看看我为你做的例子

您需要所有内部跨度向左浮动，而不仅仅是控制大小：

div{width:200px;height:200px;border:solid 1px black}
#s1{float:left;background:red;width:50%;height:100%;}
#s2{float:left;background:green;width:50%;height:50%;}
#s3{float:left;background:yellow;width:50%;height:50%;}