如何使用 CSS 将文本从一个框流到另一个框

Goo*_*bot 0 html css

我在 html 中有几个框作为

<div class="parent">
  <div class="box"></div>
  <div class="box"></div>
  <div class="box"></div>
</div>
Run Code Online (Sandbox Code Playgroud)

用 css 定义

.box{
width : 200px;
height : 300px;
display :  block;
float : left
}
Run Code Online (Sandbox Code Playgroud)

是否有提供父日志文本的方式DIV和流动儿童中的文本DIV与S CSS?还是应该用Javascript?

当然,在哪里提供文本并不重要,我只是想将多余的文本流到下一个框。

Kat*_*ieK 5

将您的 HTML 更改为包含内容的单个元素,例如:

<div class="parent">
  <div class="box"></div>
</div>
Run Code Online (Sandbox Code Playgroud)

然后添加这些样式规范:

.box {
   -moz-column-count: 3;
   -webkit-column-count: 3;
   column-count: 3;
   height: 10em; /* Or whatever height is appropriate. */
}
Run Code Online (Sandbox Code Playgroud)

有关 CSS 列的更多信息,请参阅http://css-tricks.com/snippets/css/multiple-columns/或https://developer.mozilla.org/en-US/docs/CSS/Using_CSS_multi-column_layouts#The_columns_shorthand .