[TOC]

# Bootstrap中响应式xs、sm、md、lg、xl含义

# 1. xs、sm、md、lg、xl含义

Bootstrap 的响应式布局通过 xs、sm、md、lg、xl 等断点类名实现不同屏幕尺寸的适配，具体含义如下：

断点类名	全称/含义	适用设备宽度范围	典型设备场景
xs	extra small	‌<576px‌（或部分版本<768px）	手机竖屏模式
sm	small	‌≥576px‌（或≥768px）	平板、大屏手机
md	medium	‌≥768px‌（或≥992px）	普通桌面显示器
lg	large	‌≥992px‌（或≥1200px）	大尺寸显示器
xl	extra large	‌≥1200px‌（或≥1400px）	超大屏电视或4K显示器

# 2. 设计逻辑与适配规则

• ‌移动优先‌：默认样式适用于最小屏幕（xs），更大断点需显式覆盖。
• ‌向上兼容‌：若未定义更高断点（如未设 lg），则沿用上一级断点（md）的样式。