Web前端开发规范：文件命名与CSS样式指南

本文档是关于Web前端开发规范的手册，着重强调了文件存放位置、CSS书写、HTML和JavaScript的规范，旨在提升团队协作效率、方便代码维护和新成员快速适应。 【文件存放位置规范】 文件夹的分类明确，有助于保持项目结构清晰： - flash: 用于存储Flash文件 - images: 专门放置图片资源 - inc: 存储include文件，通常为HTML片段或模板 - library: 用来保存DW库文件，即Dreamweaver的组件库 - media: 多媒体文件，如音频和视频 - script: JavaScript脚本存放处 - css: CSS样式表的家 【CSS书写规范】 - 基本原则包括重新定义HTML样式、链接状态样式和自定义样式： - 重新定义HTML样式：用于统一网页内某标签的样式，如`hr { border: 1px dotted #333333 }` - 链接状态样式：针对链接的不同状态，如`a.nav:link`和`.nav a:link` - 自定义样式：用于局部样式设定，如`.shadow` - CSS命名应具有描述性，避免使用意义模糊的名称，例如`.important_news`优于`red` - 页面内加载CSS样式应使用链接方式，如`<link rel="stylesheet" type="text/css" href="style/style.css">` - 样式顺序：重新定义的样式优先，然后是伪类，最后是自定义样式，便于阅读和维护 【文件命名规则】 - 文件名使用小写字母、数字和下划线，禁止汉字、空格和特殊字符 - HTML命名原则：索引文件命名为index.htm或index.html，子页以栏目英文翻译的单词命名，如`about` 【HTML书写规范】 - head区代码需规范，保证元数据和链接资源的正确性 - body区代码应有序，遵循语义化原则，提高可读性和可访问性 【JavaScript书写规范】 - 脚本编写要求清晰、简洁，注释充分，遵循一定的命名和变量声明规则 【图片规范】 - 图片命名应反映其内容或用途，方便管理和检索 【注释规范】 - 使用适当的注释来解释代码功能，HTML、CSS和JavaScript都应有规范的注释格式 【执行模式】 - 执行这些规范是为了提高团队协作效率、代码质量和维护性，团队成员需严格遵守，如有不适用或改进之处，应及时讨论更新规范文档 总结：这份Web前端开发规范手册涵盖了文件组织、CSS、HTML、JavaScript等多个方面，提供了清晰的指南，帮助开发者构建整洁、高效且易于维护的代码。遵循这些规范，可以显著提升开发效率，同时确保代码质量，促进团队间的协作。