ThinkChat2.0新版上线,更智能更精彩,支持会话、画图、阅读、搜索等,送10W Token,即刻开启你的AI之旅 广告
[TOC] > [home](https://tailwindcss.com/) > [中文](https://www.tailwindcss.cn/docs/responsive-design) ## 特性 1. 支持 html,vue,react 2. v.2 已取消对IE 11 的支持 ,要支持 IE11 使用 v1.9 ## 响应式设计 | 断点前缀 | 最小宽度 | CSS | | --- | --- | --- | | `sm` | 640px | `@media (min-width: 640px) { ... }` | | `md` | 768px | `@media (min-width: 768px) { ... }` | | `lg` | 1024px | `@media (min-width: 1024px) { ... }` | | `xl` | 1280px | `@media (min-width: 1280px) { ... }` | | `2xl` | 1536px | `@media (min-width: 1536px) { ... }` | 而加了前缀的功能类仅在指定断点及以上的屏幕上生效,如 "md:bg-black" 表示在 768px 像素及以上背景为黑色 ### 移动优先 - 不要使用 sm: 来定位移动设备 - 使用无前缀的功能类来定位移动设备,并在较大的断点处覆盖它们 ### h-n/p-n 中n的值 以h-n 为例 h-1 中 1 为0.25rem, h-2 为0.5rem, n的rem转为px 只许乘以4 如 h-1 即 高为4px,