本地css加载更快但需维护路径和构建流程，远程css依赖网络却可复用cdn缓存；生产环境优先本地化第三方样式，仅当资源极稳定、多站共用且配置好csp与fallback时才考虑远程引入。
本地 CSS 文件加载更快，但需维护路径和构建流程
本地 link 引入（如 <link rel="stylesheet" href="css/style.css">）走的是项目内部静态资源路径，浏览器直接从本地服务器或打包后产物中读取，无网络往返延迟。但要注意：
- 开发时路径错误会导致
404 Not Found，尤其在嵌套路由或使用base标签时，href相对路径容易错位 - 构建工具（如 Webpack、Vite）可能重写路径或哈希文件名，若手动写死
href会失效，应通过插件注入或使用public目录 - 本地文件不享受 CDN 缓存复用，每个站点都要单独加载一份副本
远程 CSS（如 CDN 链接）依赖网络质量，但可复用缓存
引入公共 CDN 上的样式（如 <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css">）的优势在于：用户若已访问过其他使用同一 CDN 资源的网站，浏览器可能直接命中强缓存，跳过请求；CDN 节点靠近用户，首字节时间（TTFB）通常优于自建服务器。
但风险明显：
- CDN 服务不可用（如 jsDelivr 暂停、域名被污染）会导致样式白屏，且无降级机制时无法自动 fallback
- HTTP/HTTPS 混合内容（mixed content）在 HTTPS 页面中引入 HTTP 远程 CSS 会被现代浏览器直接阻断，报错
Mixed Content: The page at 'https://...' was loaded over HTTPS, but requested an insecure stylesheet - 远程资源不受你控制，版本升级可能引发样式突变（如 Bootstrap 5.x → 6.x 类名变更）
CSP 策略下远程 CSS 可能被拦截
启用 Content-Security-Policy 后，远程样式表必须显式加入 style-src 白名单，否则即使链接有效也会被浏览器静默丢弃，控制台报错类似：Refused to apply inline style because it violates the following Content Security Policy directive: "style-src 'self'"。
常见疏漏点：
