Html CSS中两个div容器的交替换行

如果div容器中有一些文本，我将根据容器的大小自动换行。我想有两个div集装箱的自动断线，但要交替顺序。在图片上，你可以看到我想根据html代码得到什么。我不关注交替的颜色。我把背景标上了颜色，以便更好地理解我要找的东西

因为我想有很长的时间和不同的内容，我不想用很多容器手工完成。另一个问题是我这样做的时候缺乏灵活性。我希望它与一个灵活的周围容器大小的工作

有没有一种方法可以通过CSS或其他方式实现这一点

<div id="surrounding_container">
  <div id="box1">
     Lorem ipsum dolor sit amet consectetur adipisicing elit. Eaque quasi doloum ..  
  </div>
  <div id="box2">
    3.1415926535 8979323846 2643383279 5028841971 69399375105820974944 5923078164 0628620899 …     
  </div>
</div>

我的同僚们都是精英。是一种准多卢姆。。
3.1415926535 8979323846 2643383279 5028841971 69399375105820974944 5923078164 0628620899 …     

我正试图更详细地解释这个问题。

---

这里可能需要测试大量边缘案例，但这里有一种方法。使用2个线高度约为其正常值2倍的标签。绝对定位第二个

，使其位于第一个

行之间的空间内。当每个
的行包裹时，它们将相互偏移

其中一个明显的边缘情况是，当2个
标记的文本完全不同时，较长的
将有大量额外的行，这些行的间隔很宽。因此，只有当2个
元素具有相似的文本长度时，这才真正起作用


html{
字体大小：16px；
}
div{
位置：相对位置；
}
p{
字号：1rem；
线高：3rem；
填充：0；
保证金：0；
颜色：红色；
}
第n个孩子（2）{
位置：绝对位置；
顶部：1.5雷姆；
颜色：蓝色；
}

Lorem Ipsum只是印刷和排版行业的虚拟文本。自16世纪以来，Lorem Ipsum一直是行业标准的虚拟文本，当时一位不知名的印刷商拿起一个打印工具，将其拼凑成一本打印样本书。它不仅存活了五个世纪，而且还跨越到电子排版，基本上保持不变。它在20世纪60年代随着包含Lorem Ipsum段落的Letraset表的发行而流行

知识是一种美德，是一种美德，是一种美德，是一种美德。但是，在最低限度上，我们需要一个实验室来进行日常工作。两人或两人在一个无教区的房间里互相指责。除偶尔因疏忽而死亡外，不得因疏忽而导致动物死亡

这不是一个完整的解决方案，老实说，您的请求让我很担心，但我相信dd标记和wbr标记可能非常适合此任务。虽然它并不总是有效，但

<div>
            <dd>depending on the line above. <wbr>Something like a translation to this line.</dd>
            <dd>abhängig von der Zeile darüber. <wbr>So etwas wie eine Übersetzung zu dieser Zeile<dd>
</div>


取决于上面的行。类似于这句话的翻译。
达吕贝尔学院。因此，我们将继续努力

…结合/试验了Brett DeWoody的解决方案和CSS技能，它应该可以为您完成这项工作。也许使用无序列表也适用于您：

<ul>
  <li class="tranlsationEng">depending on the line above. <wbr>Something like a translation to this line.</li>
  <li class="translationGer">abhängig von der Zeile darüber. <wbr>So etwas wie eine Übersetzung zu dieser Zeile</li>
</ul>


取决于上面的行。类似于这句话的翻译
。因此，我们将继续努力

欢迎！因此，这不是让人们编写您想要的请求的方法。请添加一个小代码片段，看看您到目前为止已经尝试了什么。您可以再解释一下交替顺序吗？谢谢约翰·肖邦。问题是我不知道如何解决这个问题，这意味着我还没有尝试过任何东西。克里斯蒂安，我试图更详细地解释它。文本内容开始以交替行的方式流动？你为什么想要这样的东西？非常感谢你提供了有用的解决方案和快速的答案。输出正是我想要的，效果很好。谢谢你的快速回答。通过这个解，我不能得到线的交替顺序。当我理解正确时，使用-tag可以指定浏览器应该在何处进行换行。如果你对这个解决方案感兴趣，你应该看看Brett DeWoody的答案。