CSS 媒体查询生成器
CSS 媒体查询生成器按目标设备与断点值组装 @media 规则：可选 min/max-width、方向、分辨率等条件，生成嵌套其内的空规则骨架，帮你为不同屏幕写差异样式时不必纠结括号语法与断点边界。
永久免费本地计算 · 零上传
🔒 全程在浏览器内计算，输入内容不会离开您的设备。
怎么用
- 选择条件类型与比较方向
- 填写断点像素值
- 组合多个条件如宽度加方向
- 生成 @media 规则骨架
典型场景
为移动端单独收窄栅格列数
横竖屏切换调整布局方向
高分屏加载更清晰字号
常见问题
断点该取多少？
给常见手机平板桌面参考值，也可自定义边界。
能嵌套规则吗？
生成的是外层 @media，内部规则你继续补充。
支持 print 媒体吗？
可选媒体类型，包含打印等场景的条件组合。