在柵格系統中，我們在 Less 文件中使用以下媒體查詢（media query）來創建關鍵的分界點閾值。 Copy ~~~scss /* 超小屏幕（手機，小于 768px） */ /* 沒有任何媒體查詢相關的代碼，因為這在 Bootstrap 中是默認的（還記得 Bootstrap 是移動設備優先的嗎？） */ /* 小屏幕（平板，大于等于 768px） */ @media (min-width: @screen-sm-min) { ... } /* 中等屏幕（桌面顯示器，大于等于 992px） */ @media (min-width: @screen-md-min) { ... } /* 大屏幕（大桌面顯示器，大于等于 1200px） */ @media (min-width: @screen-lg-min) { ... } ~~~ 我們偶爾也會在媒體查詢代碼中包含 `max-width` 從而將 CSS 的影響限制在更小范圍的屏幕大小之內。 Copy ~~~scss @media (max-width: @screen-xs-max) { ... } @media (min-width: @screen-sm-min) and (max-width: @screen-sm-max) { ... } @media (min-width: @screen-md-min) and (max-width: @screen-md-max) { ... } @media (min-width: @screen-lg-min) { ... } ~~~