如何打印具有两列布局 A4 页面的试卷？

Question

ol li 使用两列布局打印。 ol 包含超过 80 lis。 我使用了引导程序 3。如果 li 到达页面末尾，它会转到下一列。如果两列到达ol li 开始两个下一页 例如，

I Need This:
 Column 1 (col-md-6)            Column 2 (col-md-6)
 List 1                         List 6       
 ---                            ---  
 List 2                         List 7  
 ---                            ---
 List 3                         List 8 
 ---                            ---
 List 4                         List 9 (Long Question. This is End Column 2)
 ---                            ---  
 List 5(This is End Column 1)
 ---
 <!----------- THIS IS END OF PAGE 1 --------------->
<!----------- PAGE 2 START --------------->
 Column 3 (col-md-6) 
 List 10
 --- 
 List 11 
 ---  
 List 12
 ---
 List 13(This is End Column 3)
<!----------- THIS IS END OF PAGE 2 --------------->

Sample Demo

在这个演示中： 21 和 22 列表项放置在第二页..但这实际上放置在第一页第二列顶部。列表 44 也位于第三列顶部。但现在它错误地放在第二列。

注意：我准备试卷。所以我需要两列打印 A4 表。我需要一些建议.. 是否可以与 Jquery 和 CSS 一起使用？

Answer 1

使用 css3 coulmn 属性代替引导网格

ol {
    -webkit-column-count: 2; /* Chrome, Safari, Opera */
    -moz-column-count: 2; /* Firefox */
    column-count: 2;
}
ol {
    -webkit-column-gap: 40px; /* Chrome, Safari, Opera */
    -moz-column-gap: 40px; /* Firefox */
    column-gap: 40px;
}

这里column-count: 2; 将创建两个网格，将所有li 划分为2，column-gap: 40px; 是两个网格之间的空间。