Question

我有一些文本和专栏文章将其分为3列。

<div id="press">
  <div class="wide">
  Placeholder=
</div>

columnizer脚本就像这样

$(function(){
  $('.dp-highlighter').addClass("dontsplit");
  $('li').addClass("dontsplit");
  $('.wide').columnize({width:250});
  $('.thin').columnize({width:200});
});

我的CSS就像这样;

.column p, .column h1{ padding: 15px; }
#press {
  text-align: justify;
  margin: 0px 100px; 
  width: 80%;
  color: white;
  font-family: courier, Times New, serif;
}
.wide, .thin { clear:both; }

如何在与列规则函数类似的列之间显示一行？

Answer 1

在应该列化的块中直接创建一个额外的<div> ：

<div class="wide">
    <div>
        Here goes your text
    </div>
<div>

并将规则作为CSS边框添加到此<div>：

.column div {
     border-left: 1px solid black;
 }

直接向.column添加边框不起作用，但在大多数情况下会阻止文本进行列化。

Answer 2

您可以尝试在左侧或右侧使用边框：

.column{
    border-left: 1px solid #000;
}

在Columnizer jquery中创建列规则

2 个答案: