Question

我对最新版本的bootstrap印象深刻。我已经开始研究它了。现在我可以理解，网格系统适用于4个列类大小的变体，具有以下定义：

col-xs-* ---> mobile

col-sm-* ---> tablet

col-md-* ---> laptops

col-lg-* ---> large monitors

但是，我需要知道，应用这些类的最小和最大分辨率是多少，以便我可以更好地设计布局。

我问这个是因为，我可以看到col-md类应用于800px。我使用Firefox的响应式视图模拟器生成了这个解决方案。

Answer 1

来自the documentation for the grid：

/ *超小型设备（手机，小于768px） /   / 没有媒体查询，因为这是Bootstrap * /
中的默认值
/ *小型设备（平板电脑，768px及以上）* /   @media（min-width：@ screen-sm-min）{...}

/ *中型设备（台式机，992px及以上）* /   @media（min-width：@ screen-md-min）{...}

/ *大型设备（大型台式机，1200px及以上）* /   @media（min-width：@ screen-lg-min）{...}

它还提供容器宽度：

.col-xs- *：none（auto）
.col-sm- *：750px
.col-md- *：970px
.col-lg- *：1170px

Answer 2

col-xs- * =小于768px

col-sm- * = 768px及以上

col-md- * = 992px及以上

col-lg- * = 1200px及以上

Answer 3

有关Bootstrap 3的详细信息，您可以点击此链接Bootstrap 3 Grid options

超小型设备电话（＆lt; 768px）（col-xs）
小型设备平板电脑（≥768px）（col-sm）
中型设备台式机（≥992px）（col-md）
大型设备台式机（≥1200px）（col-lg）

bootstrap 3 max＆amp;最低分辨率为col- *

3 个答案: