7自举中的列栅格在xs

Question

我真的很喜欢这个代码pen，我想用它创建一个日历，但是我需要它在screen-xs使用bootstrap折叠，我不知道该怎么做。

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

我也无法理解CSS。

Answer 1

如果您想使用引导来渲染日历，我建议您通过更改列数来编译自定义版本。 12列的默认值是不实际的，所以在这里改变它14（输入“@ grid-columns”）：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）