媒体查询

Bootstrap 中的媒体查询允许你根据视口大小移动，显示和隐藏内容。以下媒体查询在 LESS 文件中用于在 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) { ... }

偶尔会将这些扩展为包含最大宽度以将 CSS 限制为更窄的设备集：

@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) { ... }