(Bootstrap / Jekyll)在单独的列中按年和月定义的发布列表

时间:2014-02-19 14:48:27

标签: twitter-bootstrap jekyll liquid

我希望我的帖子列表的格式可以遵循类似的内容,其中年份和月份是单独的列:

enter image description here

I know how to specify the year and month for a list of posts,但我的实施最终看起来像这样:

enter image description here

有没有人有关于如何使用列或类似方法执行此操作的提示?我猜我需要更改Bootstrap模板并将Liquid数据合并到其中,但我无法直观地了解它是如何完成的。

1 个答案:

答案 0 :(得分:1)

我不知道Liquid,但是为了在bootstrap中使用列,创建一个网格结构并用CSS类名标记它,这是一种方法:

<div class="container">
    <div class="row">
        <div class="col-xs-2">
            <h2>2014</h2>
        </div>
        <div class="col-xs-2">
            <h3>February</h3>
        </div>
        <div class="col-xs-8">
            <h4><a href="#">My amazing post about something boring</a></h4>
            <h4><a href="#">My boring post about something amazing</a></h4>
            <p class="tags">
                Tagged: <span>java</span>  <span>proxy</span>
            </p>
        </div>
    </div>
</div>

请参阅docs for the bootstrap grid system


Click Me, I'm The Demo Button!