必须加 .css 后缀；统一用短横线分隔单词；按功能边界组织文件名；纯全局样式需加业务/模块前缀；文件名需随组件逻辑同步更新。
外部 CSS 文件名要不要加 .css 后缀？
必须加。浏览器识别外部样式表依赖 link 标签中的 type 和文件后缀双重判断，省略 .css 会导致部分服务器返回错误 MIME 类型（如 text/plain），样式直接失效。即使设置了 type="text/css"，不带后缀的文件也可能被 CDN 或代理缓存为非样式类型。
用下划线还是短横线分隔单词？
统一用短横线（-），比如 header-layout.css、form-validation.css。下划线在 URL 中显示为低空线，易与文字下划线混淆；更重要的是，CSS 类名本身推荐用短横线（BEM 规范），保持命名风格一致能减少团队认知切换成本。Node.js 的 require() 或构建工具（如 Vite、Webpack）对含下划线的路径也偶有解析异常。
要不要按组件/功能/层级来组织文件名？
要，而且优先按功能边界切分，而不是技术层级。例如：
-
button-primary.css（功能明确，可复用） -
modal-overlay.css（描述行为+结构，比component-modal.css更直白） - 避免
style-v2.css、base.css这类模糊命名——没人知道 “base” 到底管不管字体重置或表单默认样式。
真实协作中，开发者搜 search-input 比搜 form 更快定位到具体样式文件。
立即学习“前端免费学习笔记（深入）”；
大项目里要不要加作用域前缀？
看构建流程。如果用 CSS Modules、Shadow DOM 或 PostCSS 插件自动加哈希，不需要手动加前缀；但纯全局样式场景下，建议用业务或模块缩写打头，比如 shop-cart-styles.css、cms-editor-theme.css。这样在 DevTools 里查看 link 标签时，一眼能区分来源，也方便通过 grep 快速筛出某模块所有样式文件。
user-profile-old.css 和 user-profile-new.css 并存半年。 
