标签用于引入外部CSS文件，需放在中并设置rel="stylesheet"和href属性，推荐使用相对路径或根相对路径；加载时应将关键CSS优先内联或预加载，非关键样式延迟加载，并用media属性区分条件样式，避免遗漏rel属性或将标签置于body末尾，以提升页面渲染性能。
css_路径与加载顺序技巧">
在网页开发中， 标签用于引入外部资源，最常见的用途是加载外部 CSS 文件。正确使用该标签并掌握加载顺序技巧，能有效提升页面渲染性能和用户体验。
1. 基本语法：引入外部CSS文件
使用 标签引入 CSS 时，需将标签放在 HTML 文档的 区域中，并设置以下属性：
- rel="stylesheet"：定义当前文档与目标资源的关系为样式表
- href：指定 CSS 文件的路径（相对或绝对）
- type="text/css"：可选，现代浏览器可自动识别类型
2. 路径写法：相对路径 vs 绝对路径
路径选择影响资源能否正确加载：
-
相对路径：相对于当前 HTML 文件位置。例如，HTML 在根目录，CSS 在 css 子目录：
href="css/style.css" -
绝对路径：以域名开头或从根目录开始。例如：
href="/css/style.css"（从网站根目录查找）
href="https://example.com/css/style.css"（远程资源）
推荐使用相对路径或根相对路径，便于项目迁移和本地调试。
立即学习“前端免费学习笔记（深入）”；
3. 加载顺序与性能优化技巧
CSS 是渲染阻塞资源，加载顺序直接影响页面显示速度：
- 将 link 标签放在 中：确保样式在内容渲染前加载，避免“无样式内容闪烁”（FOUC）
- 优先加载关键CSS：将首屏所需样式内联或优先加载，非关键样式延迟加载
-
使用 media 属性控制加载条件：例如打印样式不会阻塞屏幕渲染
-
预加载重要资源：通过 preload 提示浏览器提前获取关键CSS
4. 避免常见错误
- 不要遗漏 rel="stylesheet"，否则CSS不会被应用
- 避免在 body 末尾加载 CSS，可能导致页面重绘或样式闪现
- 检查路径拼写和大小写，尤其在 Linux 服务器上路径区分大小写
- 多个 link 标签按引入顺序应用，后加载的样式会覆盖前面的同名规则
基本上就这些。合理使用 标签，不仅能正确引入样式，还能通过控制加载顺序提升页面响应速度。不复杂但容易忽略细节。
