2

对不起,如果我的英语有错误))。我的问题是如何制作具有高度限制的 div?我的意思是,我的 div 有一些 ul 块,例如:

<div>
 <ul>
  <li>First text</li>
 </ul>
</div> 

我的 DIV 的高度为 280 像素。当我尝试添加越来越多时<li>smth...</li>- 它越来越低,毕竟我的文本低于我的 div 的高度限制。

不要提出浮动:左,这意味着我所有的文本都将添加到水平线中,但我想达到垂直高度限制。像报纸一样的东西,你知道的。

逻辑:我的文字必须在我的高度限制之前越​​来越低,在那之后,我的文字必须自己分裂,并继续在新的垂直线上向下移动到同一个 div 元素中。

不明白我在说什么的人的图像:

图片

4

1 回答 1

1

我不确定是否可以在此脚本中合并宽度,但它将允许从列到列的流动。我还注意到这似乎在 IE 中不起作用。

<head>
<style> 
.columnFlow
{
-moz-column-count:3; /* Firefox */
-webkit-column-count:3; /* Safari and Chrome */
column-count:3;

-moz-column-gap:40px; /* Firefox */
-webkit-column-gap:40px; /* Safari and Chrome */
column-gap:40px;

-moz-column-rule:2px outset #ff00ff; /* Firefox */
-webkit-column-rule:4px outset #ff00ff; /* Safari and Chrome */
column-rule:4px outset #ff00ff;
}
</style>
</head>
<body>

<div class="columnFlow">
This text will flow within 3 different columns. The only think that I am unsure about is how to get this to work within IE. Also I am not sure how to specifically set the width. It appears as though it even spreads the provided text evenly within the amount of columns that the developer chooses. I hope this helps.
</div>

</body>

W3C 站点上还有一些其他版本。我希望这有帮助!http://www.w3schools.com/css3/css3_multiple_columns.asp

于 2013-02-21T21:16:29.430 回答