CSS跨域加载失败的根本原因是浏览器静默丢弃样式内容，必须同时配置服务端Access-Control-Allow-Origin响应头和前端link标签的crossorigin属性；@import因无法声明crossorigin且不触发CORS协商，必然失败，唯一可靠方案是改用带crossorigin的link标签。
CSS跨域加载失败，不是资源没拿到，而是浏览器主动丢弃了样式内容——必须同时配置服务端响应头和前端 <link> 标签的 crossorigin 属性，缺一不可。
为什么 @import 跨域 CSS 一定失败
浏览器对 @import 加载跨域 CSS 的限制极严：它不发送凭据，也无法声明 crossorigin，即使服务端返回了正确响应头，浏览器在 CSS 解析阶段仍会将响应视为“不透明（opaque）”，直接丢弃内容，控制台只报 CORS policy: No 'Access-Control-Allow-Origin' header is present，但实际请求已发出且返回了 200。
- 根本问题不是“请求被拦”，而是“请求成功但无法被 CSS 引擎消费”
-
@import无法触发带 CORS 的预检或凭证协商，服务端加了头也没用 - 唯一可替代方案是改用
<link rel="stylesheet">并显式设置crossorigin
<link> 的 crossorigin 属性怎么设才有效
<link> 支持 crossorigin 属性，这是目前唯一可控、可调试的跨域 CSS 加载方式。它让浏览器明确以 CORS 模式发起请求，并校验响应头是否匹配。
-
crossorigin="anonymous"：最常用，不携带 Cookie 或认证信息；服务端需返回Access-Control-Allow-Origin: https://your-app.com（不能是*，若需支持凭证则另说） -
crossorigin="use-credentials"：需携带当前域凭证（如内网 SSO）；服务端必须返回Access-Control-Allow-Origin: https://your-app.com+Access-Control-Allow-Credentials: true，且不能设为* - 不加
crossorigin属性时，浏览器按“非 CORS 模式”请求，服务端即使有响应头也无效
服务端 CORS 响应头配置的关键细节
光加 Access-Control-Allow-Origin 不够，顺序、组合与缓存策略都会导致失败。尤其注意 Vary: Origin 和缓存冲突问题。
立即学习“前端免费学习笔记（深入）”；
- Apache 需启用
mod_headers，用Header set（非always set）避免重复头；示例：Header set Access-Control-Allow-Origin "https://your-app.com" - Nginx 中字体/CSS 文件路径需单独匹配，例如：
location ~* \.(css|woff2|woff)$ { add_header Access-Control-Allow-Origin "https://your-app.com"; } - 若返回了
Vary: Origin，而 CDN 或代理缓存未按Origin键区分，则可能把 A 域的响应缓存后返回给 B 域，造成“明明配了头却报错” -
Access-Control-Allow-Origin必须与前端请求 Origin 完全一致（协议+域名+端口），http://localhost:9000和https://example.com视为不同源
字体文件（@font-face）同样要加 crossorigin
CSS 中通过 @font-face 引入跨域字体时，若不加 crossorigin，浏览器默认以非 CORS 模式请求，服务端即使返回了正确头，字体仍会加载失败或渲染异常。
- 必须在
@font-face块中显式写crossorigin: anonymous;（注意末尾分号） - 服务端对
.woff2、.woff等扩展名需单独配置响应头，Nginx 示例：add_header Access-Control-Allow-Origin "https://your-app.com" always; - 动态加载字体时（如
FontFaceAPI），也要传crossorigin: 'anonymous'选项，否则load()会静默失败
最容易被忽略的是缓存层干扰——CDN、反向代理或浏览器自身缓存可能把无 Access-Control-Allow-Origin 头的旧响应缓存下来，后续即使服务端已修复，前端仍持续报错。排查时先禁用缓存或加时间戳参数验证，再确认响应头真实生效。
