列中的Bootstrap写作（如报纸）

Question

我正在使用django和bootstrap，我想知道是否有办法像报纸一样写入列。显然，在bootstrap中创建列很容易，但我想知道如何让文本很好地分成列，这样就没有一列更长。我还会包括一个＆＃39;作家＆＃39;其中一列顶部的部分，所以我需要考虑到这一点。

我正在考虑将列中的单词除以列数，但我认为列上会有一次运行，主要是因为编写器部分。

Answer 1

对于browsers that support it，您可以使用columns css3属性：

.twoColumns{
    -webkit-column-gap: 20px;
       -moz-column-gap: 20px;
            column-gap: 20px;
    -webkit-column-count: 2;
       -moz-column-count: 2;
            column-count: 2;
}

<div class="twoColumns">
    Sed ut perspiciatis unde omnis iste natus error ...
</div>

Demo in Fiddle

---

如果您需要支持旧浏览器，可以在此处使用polyfill：

https://github.com/BetleyWhitehorne/CSS3MultiColumn

在样式表后包含脚本，如果需要，它将转换：

<link rel="stylesheet" type="text/css" href="stylesheet.css" />
<script type="text/javascript" src="css3-multi-column.js"></script>

---

或者您可以使用Columnizer这样的Javascript进行此操作：

$('.twoColumns').columnize({ columns: 2 });