@import必须位于css文件最开头（仅允许@charset在其前），路径基于当前css文件位置，会阻塞渲染且不支持链式并行加载，媒体查询须紧接url后。
@import 必须写在样式表最前面
如果 @import 前面有其他 CSS 规则（哪怕是一行注释、一个空行、或 @charset 之外的任何声明），浏览器会直接忽略它，不加载子样式表。这不是警告，是静默失效。
- ✅ 正确：文件开头第一行就是
@import url("base.css"); - ❌ 错误：顶部先写了
body { margin: 0; }，再写@import - ⚠️ 注意：
@charset "UTF-8";是唯一允许出现在@import之前的语句，且必须紧贴首行
@import 的 url() 写法和路径容易出错
路径解析基于「当前 CSS 文件所在位置」，不是 HTML 页面位置。很多人误以为相对路径从 HTML 开始算，结果 404 却查不出原因。
- 假设
main.css在/assets/css/main.css，想引入同级的reset.css，应写@import url("reset.css");，不是@import url("../css/reset.css"); - 用绝对路径更稳：
@import url("/assets/css/variables.css"); - 不推荐省略
url()直接写字符串（如@import "a.css";），部分旧版 Safari 会解析失败
@import 会阻塞渲染，比 慢得多
浏览器遇到 @import 时，会暂停当前样式表解析，发起网络请求，等子样式表下载并解析完才继续。而 <link> 是并行加载的。
网钛淘拍CMS(TaoPaiCMS) V1.60
下载
2013年07月06日 V1.60 升级包更新方式：admin文件夹改成你后台目录名，然后补丁包里的所有文件覆盖进去。1.[新增]后台引导页加入非IE浏览器提示，后台部分功能在非IE浏览器下可能没法使用2.[改进]淘客商品管理 首页 列表页 内容页 的下拉项加入颜色来区别不同项3.[改进]后台新增/修改淘客商品，增加淘宝字样的图标和天猫字样图标改成天猫logo图标4.[改进]为统一名称，“分类”改
- 页面有 3 个
@import链式嵌套？那基本是串行加载，白屏时间明显拉长 - 现代项目里，除非是极小的变量文件（如
colors.css），否则优先用<link rel="stylesheet"> - 构建工具（如 Webpack、Vite）打包时，
@import通常会被内联或转为link，但开发时仍要留意原始行为
媒体查询条件写在 @import 后面才生效
@import 支持条件加载，但语法位置很关键：媒体查询必须紧跟在 url 后面，不能换行，也不能放在分号之后。
立即学习“前端免费学习笔记（深入）”；
- ✅ 正确：
@import url("print.css") print; - ✅ 正确：
@import url("mobile.css") (max-width: 768px); - ❌ 错误：
@import url("mobile.css"); (max-width: 768px);—— 后半段被当普通 CSS，无效 - ⚠️ 注意：条件只控制是否加载，不控制是否应用；加载后若匹配不到媒体环境，规则本身仍不会生效
@import 最常栽在顺序和路径上，而且问题往往不报错，只是样式没出来——这时候先盯住文件开头有没有空行、有没有 @charset 写错位置，比调半天控制台更有用。 
