命名规范

  • 类名：使用小写字母与短横线连接，如 btn-primary
  • ID名：避免过度使用，必要时遵循 id-name 规则
  • 变量名：采用 --custom-var 命名格式，如 --main-font

结构规范

  1. 层级划分
    • 使用语义化标签（如 <section>、<article>）
    • 避免嵌套过深（建议不超过3层）
  2. 样式组织
    • 按模块划分CSS文件，如 components/_button.css
    • 使用SCSS/LESS嵌套语法提升可读性

最佳实践

  • 优先使用CSS变量：@import 导入全局变量文件
  • 响应式设计：通过媒体查询实现 mobile-friendly
  • 性能优化：压缩代码并启用 critical_css 技术

扩展阅读

如需深入了解CSS模块化开发，可参考 CSS_模块化实践指南

CSS_编码规范