有关html中位置的一些问题

Question

[怎么可能用纯html / css对此做类似的处理，将两个单词放在一个大单词一边的另一个单词下面？ （我知道有可能使用boostrap网格系统，但我想了解纯html），此外，这样做并能够自由地上下移动三个单词？

此外，如何做才能使元素互相渗透？ （因为某些字体上面带有较大的边框，因此由于该边框，您不能使另一个单词彼此靠近）

Answer 1

您可以使用多个div和一个Flexbox并将其封装到容器div中。我还添加了align-items: center;以使它们并排居中。看看我在这里做什么：

.container{
  display: flex;
  align-items: center;
}

.bigword {
  font-size: 80px;
}

<div class="container">
  <div class="smallcontainer">
    <div class="smallword">Small1</div>
    <div class="smallword">Small2</div>
  </div>
<div class="bigword">BigWord</div>
</div>