Pure.css 必须通过 jsDelivr CDN 引入 v3.0.0 版本 pure-min.css，栅格需手动加容器并额外引入 pure-responsive-min.css 才响应式，表单按钮需用专用类名且避免与全局样式冲突。
Pure.css 的 CDN 引入方式和常见加载失败原因
Pure.css 官方不托管 npm 包（@purecss/pure 已废弃），现在只推荐通过 CDN 直接引入，否则容易遇到 404 或样式不生效。最稳的是用官方推荐的 jsDelivr 链接，不是 unpkg，也不是 cdn.jsdelivr.net 的旧路径。
- 正确写法：
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/purecss@3.0.0/build/pure-min.css"> - 如果用了
unpkg.com/purecss，可能加载到未构建的源码目录，导致 404；cdn.jsdelivr.net/purecss缺少版本号会 fallback 到错误路径 - 注意：v3.0.0 开始默认只含基础 CSS（
pure-min.css），栅格、表单等模块需单独引入，比如pure-grids-min.css - 本地开发时若用 file:// 协议打开 HTML，部分浏览器会因 CORS 拒绝加载 CDN 资源——必须起一个本地服务（如
python3 -m http.server）
Pure.css 栅格系统为什么“不居中”“不响应”
很多人套了 pure-g 和 pure-u-1-2 却发现布局堆成一列、宽度没变化，根本原因是 Pure.css 的栅格默认不设 max-width、不自动居中，也不开媒体查询断点——它把控制权完全交给你。
- 必须手动加容器：
<div class="pure-g"><div class="pure-u-1-2">...</div></div>，且父容器不能是width: 100%的块级元素（比如直接子元素），否则pure-u-*计算会失准 - 响应式要显式启用：Pure.css v3 默认关闭所有断点，得额外引入
pure-responsive-min.css，且该文件必须在pure-min.css之后加载 -
pure-u-1-2是基于 flex 的百分比宽度，不是 float 布局，所以不需要clear，但也不能和float混用，否则 flex 容器会失效
按钮、表单控件样式被覆盖或显示异常
Pure.css 的 pure-button 和 pure-form 类名极简，几乎不带重置逻辑，一旦页面已有全局 button { padding: 0 } 或 * { box-sizing: border-box } 类规则，就容易错位或尺寸崩坏。
- 务必检查是否漏了
pure-form-aligned或pure-form-stacked—— Pure.css 不给表单默认垂直/水平排列，pure-form只做基础重置 - 按钮禁用状态要用
pure-button-disabled，而不是原生disabled属性，后者不会触发 Pure.css 的灰阶样式（v3 中[disabled]选择器未被定义） - 自定义字体大小后，
pure-button的行高可能错乱，建议用font-size: inherit保持继承，而非硬写14px - IE11 下
pure-u-1-3在 flex 容器中可能换行，需加flex-shrink: 0（Pure.css 本身没设）
和现代框架（React/Vue）一起用的 DOM 干扰问题
Pure.css 是纯 CSS 库，不操作 DOM，但它的类名太短（如 pure-g、pure-u-1-2），容易和组件库或 BEM 命名冲突，尤其在 SSR 或服务端渲染场景下，class 名重复会导致样式覆盖或丢失。
立即学习“前端免费学习笔记（深入）”；
- 避免直接在 JSX 中写
className="pure-g"，改用模板字符串拼接或工具函数封装，比如clsx('pure-g', props.className) - Vite / Webpack 构建时若启用了 CSS Scope（如 Vue SFC 的
scoped），Pure.css 的全局样式会被隔离——必须把 Pure.css 放进index.html的，别 import 到组件里 - 使用 Tailwind 后再加 Pure.css，大概率出现按钮圆角、间距、字体权重打架，因为两者都重置了
button、input等元素，默认优先级相近
Pure.css 的“极简”是双刃剑：它不帮你做决定，也就意味着每个布局、每个断点、每个状态都要你亲手确认是否生效——最容易忽略的是那个 pure-responsive-min.css 文件，没它，栅格就是静态的。
