我在 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?
当然,在哪里提供文本并不重要,我只是想将多余的文本流到下一个框。
将您的 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 .