twitter-bootstrap - 为 col-* Bootstrap 3 个最大和最小分辨率

Question

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

col-xs-* ---> mobile

col-sm-* ---> tablet

col-md-* ---> laptops

col-lg-* ---> large monitors

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

我问这个是因为，我可以看到 col-md 类应用于 800px。我使用 Firefox 的响应式 View 模拟器生成了这个分辨率。

Answer 1

来自 the documentation for the grid :

/* Extra small devices (phones, less than 768px) / / No media query since this is the default in Bootstrap */

/* Small devices (tablets, 768px and up) */ @media (min-width: @screen-sm-min) { ... }

/* Medium devices (desktops, 992px and up) */ @media (min-width: @screen-md-min) { ... }

/* Large devices (large desktops, 1200px and up) */ @media (min-width: @screen-lg-min) { ... }

它还提供容器宽度:

.col-xs-*:无(自动)

.col-sm-*: 750 像素

.col-md-*: 970 像素

.col-lg-*: 1170 像素