tailwindcss css类样式
最后更新于:2022-04-02 03:17:02
[TOC]
## 特性
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,
';