twitter-bootstrap-3 - 小提琴中意外的引导 3 行为

Question

bootstrap 3 包含在小提琴下面的 html中

<div class="col-lg-1">hi</div>
<div class="col-lg-10">hi</div>
<div class="col-lg-1">hi</div>

有预期的输出：-

hi          hi                                                  hi

在小提琴中它显示为： -

hi
hi
hi

这是为什么？

Answer 1

bootstrap 3 是移动优先的。这意味着屏幕尺寸对于引导非常重要。小提琴中默认的屏幕尺寸非常小。

.col-lg- 用于大屏幕尺寸。用 .col-xs 代替它，你会得到预期的输出

<div class="col-xs-1">hi</div>
<div class="col-xs-10">hi</div>
<div class="col-xs-1">hi</div>

更新的小提琴