7引导程序中的列网格在xs处折叠

Question

我非常喜欢这段代码pen，我想用它来创建一个日历，但是我需要它使用bootstrap在screen-xs崩溃，我不知道该怎么做。

我尝试添加.seven-cols .col-xs-1和.seven-cols .col-xs-12，但它仍然只分为两点。

我也无法理解CSS。

Answer 1

如果您想使用bootstrap渲染日历，我建议您通过更改列数来编译自定义版本。 12列的默认值不实用，所以在此更改为14（输入＆＃34; @ grid-columns＆＃34;）：http://getbootstrap.com/customize/#grid-system

如果您想保留原始引导程序，请每天使用1列，并在第一天使用偏移量：http://jsfiddle.net/wj635bsr/

<div class="row">
    <div class="day col-md-1 col-md-offset-2">
        <div class="day-title">Monday</div>
    </div>

    ...

</div>

我是这个例子，我使用col-md- *因为col-xs- *是一种不同的行为：（http://getbootstrap.com/css/#grid-options）