Skip to main content

2 响应式规则

1 css响应式规则​

@media only screen and (min-width: 1100px) {
    // 设备宽度大于或等于1000px 生效
}
@media only screen and (max-width: 1100px) {
    // 设备宽度小于或等于1000px 生效
}

2 常见的宽度划分对应的设备表​

设备宽度备注
sm640px - 640px+手机之类的手持设备屏幕
md768px - 768px+平板之类的设备屏幕
lg1024px - 1024px+常见的智慧屏幕尺寸宽度如快递柜或ATM机的显示屏幕宽度
xl1280px - 1280px+再大些的智慧屏幕尺寸
2xl1536px - 1536px+常见规格的电脑屏幕宽度