下载文档原格式
![Html5+css3Web前端开发规范标准[详]](https://img.taocdn.com/s1/m/7b683c3380eb6294dc886c5f.png)
Web前端开发规文件规为输出高质量的Web页面，提高团队协作效率，便于后台人员添加功能及前端后期优化与维护，如有错误及时提出更改。
1、html，css，js，images,fonts等文件目录组织如下如示：├── xxx.html├── css/│ ├── index.css│ ├── header.css│ ├── footer.css│ └── 2016/│ │ ├── content.css│ │ └── nav.css├── js/│ ├── xxx.js│ ├── xxx_min-tab.js│ └── 2016/└── images/│ ├── index_head.jpg│ ├── index_logo.gif│ └── 2016│ │ ├── xxx.jpg│ │ └── xxx.png└── fonts/└── xxx.ttf文件命名原则调整为所有字母小写，单词之间使用破折号（-）相连，压缩后的文件在原文件名（除扩展名）后添加.min。
参考bootstrap文件命名：bootstrap-theme.css, bootstrap-theme.min.css。
常用目录名：data(数据库) images(图片) install (安装) templets (模版) include (包含) admin (后台) rss (定阅) media (媒体) config (配置) Script (脚本) Language (语言) style (样式);引入 CSS 和 JavaScript 文件<link rel="stylesheet" href="code-guide.css"><style>/* ... */</style><!-- JavaScript --><script src="code-guide.js"></script>class 用于标识高度可复用组件，因此应该排在首位。
目录目录 (1)第一部分：HTML 4.01 / XHTML 1.0 参考手册 (3)按功能顺序列出的HTML 4.01/XHTML 1.0 标签手册 (3)核心属性(Core Attributes) (8)语言属性(Language Attributes) (12)键盘属性(Keyboard Attributes) (13)窗口事件(Window Events) (13)表单元素事件(Form Element Events) (13)键盘事件(Keyboard Events) (14)鼠标事件(Keyboard Events) (14)第二部分CCS手册 (14)缩写： (49)CSS 背景属性 (49)CSS 边框属性(border) (50)CSS 文本属性 (52)CSS 字体属性(font) (53)CSS 外边距属性(margin) (55)CSS 内边距属性(padding) (55)CSS 列表属性(list) (56)内容生成 (57)轮廓 (57)CSS 尺寸属性(Dimension) (58)CSS 分类属性(Classification) (58)CSS 定位属性(Positioning) (60)CSS 表格属性 (61)CSS 伪类 (61)CSS 伪元素 (62)打印属性 (62)听觉样式表 (63)CSS2 听觉参考 (63)CSS 单位 (66)尺寸 (66)尺寸 (66)颜色 (66)第三部分：JavaScript 参考手册 (67)String对象方法 (67)String 对象的方法 (67)String 对象的属性 (69)JavaScript Date 对象参考手册 (69)Date 对象的方法 (69)Date 对象的属性 (71)Array 对象的方法 (72)Array 对象的属性 (72)JavaScript Boolean 对象的参考手册 (72)Boolean 对象的方法 (73)Boolean 对象的属性 (73)JavaScript Math 对象的参考手册 (73)Math 对象的方法 (73)Math 对象的属性 (74)JavaScript Number 对象参考手册 (75)Number 对象的方法 (75)Number 对象的属性 (76)JavaScript RegExp 对象参考手册 (76)RegExp 对象的方法 (76)支持正则表达式的String 对象的方法 (77)RegExp 对象的属性 (77)JavaScript 函数参考手册（全局对象） (77)顶层函数（全局函数） (77)顶层属性（全局属性） (78)JavaScript 事件参考手册 (78)事件句柄 (78)第四部分：HTML DOM 参考手册 (80)JavaScript 对象 (80)HTML DOM 对象 (80)第五部分：SQL 快速参考 (82)SQL 语句 (82)第六部分：HTML 服务器控件 (85)HTML 服务器控件 (85)Web 服务器控件 (85)Web 服务器控件 (86)创建一个Web 服务器控件的语法是： (86)Validation 服务器控件 (87)Validation 服务器控件 (87)创建Validation 服务器控件的语法是： (87)第一部分：HTML 4.01 / XHTML 1.0 参考手册按功能顺序列出的HTML 4.01/XHTML 1.0 标签手册∙NN：显示所支持标签的Netscape 的最早版本。
前端开发设计规范文档一、引言前端开发是为用户提供良好的用户体验和友好的界面而进行的开发工作。
为了保证开发的一致性和高效性，制定前端开发设计规范是至关重要的。
本文档旨在提供一套通用的前端开发设计规范，帮助团队成员在开发过程中更好地协同工作，并提供一致美观的用户体验。
二、命名规范1.文件和目录命名规范-使用小写字母和连字符"-"，不使用大写字母、空格或下划线。
-确保文件和目录名称清晰、简洁且有意义。
2.变量和函数命名规范-使用有意义的英文单词或短语命名变量和函数。
-使用小驼峰命名法，即第一个单词首字母小写，后续单词首字母大写。
-避免使用过于简单的变量名，如a、b、x、y等。
3.CSS类和ID命名规范-使用英文单词或短语命名CSS类和ID。
-使用连字符"-"分隔单词，避免使用下划线。
-避免使用过于简单的类名或ID，如a、b、c等。
三、HTML规范1.DOCTYPE声明规范- 使用 HTML5 的 DOCTYPE 声明，即 <!DOCTYPE html>。
3.属性使用规范-使用双引号""包裹属性值。
-避免使用行内样式，优先使用外部CSS文件。
四、CSS规范1.选择器使用规范-使用类选择器和ID选择器，避免使用元素选择器。
-避免使用过于复杂的选择器，保持简洁性和性能。
2.样式书写规范-使用缩进和换行使样式代码更易读。
-按照属性的字母顺序排列样式规则。
- 使用简写属性，如 margin、padding、font等。
3.文件组织规范-将样式规则分别存放在不同的CSS文件中，便于维护和管理。
五、JavaScript 规范1.变量和常量声明规范- 使用 var、let 或 const 声明变量和常量，避免使用全局变量。
-尽量将变量声明和赋值放在同一行。
2.代码书写规范-使用缩进和换行使代码更易读。
-使用驼峰命名法命名变量、函数和对象属性。
-使用分号";"结束语句。
前端开发规范手册1.1概述为提高团队协作效率，便于后台人员添加功能，及前端后期优化维护，输出高质量的文档，特制订此文档。
本规范文档一经确认，前端开发人员必须按本文档规范进行前台页面开发。
本文档如有不对或者不合适的地方请及时提出，经讨论决定后可以更改。
1.2基本准则符合web标准，语义化HTML，结构表现行为分离，兼容性优良。
页面性能方面，代码要求简洁明了有序，尽可能的减小服务器负载，保证最快的解析速度。
2.1文件命名规则文件名称统一用小写的英文字母、数字和下划线的组合，其中不得包含汉字、空格和特殊字符。
命名原则的指导思想：一是使得工作组的每一个成员能够方便的理解每一个文件的意义。
二是当在文件夹中使用“按名称排例”的命令时，同一种大类的文件能够排列在一起，以便查找、修改、替换、计算负载量等等操作。
1.HTML命名原则引导文件统一使用index.htm、index.html、ndex.asp文件名（小写）。
各子页命名的原则首先应该以栏目名的英语翻译取单一单词为名称。
例如：关于我们\aboutus信息反馈\feedback产品\product如果栏目名称多而复杂并不好以英文单词命名，则统一使用该栏目名称拼音或拼音的首字母表示；每一个目录中应该包含一个缺省的html文件，文件名统一用index.htm、index.html、index.asp。
2.图片命名原则图片的名称分为头尾两部分，用下划线隔开，头部分表示此图片的大类性质。
例如：广告、标志、菜单、按钮等。
放置在页面顶部的广告、装饰图案等长方形的图片取名：banner。
标志性的图片取名：logo。
在页面上位置不固定并且带有链接的小图片取名：button。
在页面上某一个位置连续出现，性质相同的链接栏目的图片取名：menu。
装饰用的照片取名：pic。
不带链接表示标题的图片取名：title。
例如：banner_sohu.gifbanner_sina.gifmenu_aboutus.gifmenu_job.giftitle_n ews.giflogo_police.giflogo_national.gifpic_people.jpg鼠标感应效果图片命名规范为"图片名+_+on/off"。
前端开发设计规范文档一、引言二、代码编写规范1.缩进和空格-使用2个空格作为一个缩进层级。
- 在每个关键词或运算符后添加一个空格，如if (condition) {}。
-每行代码的末尾都应该去掉多余的空格。
2.行长限制每行代码应控制在80个字符以内，避免过长的代码行导致代码难以阅读和理解。
3.注释-使用注释来解释代码的意图和逻辑。
-使用单行注释（//）来注释一行代码，使用多行注释（/*...*/）来注释一段代码。
-注释要保持与代码同步，当代码发生修改时，注释也应随之更新。
4.变量和函数命名- 使用驼峰命名法（camelCase）命名变量和函数。
变量和函数名应该清晰明确，能够准确表达其含义。
-避免使用缩写和简写，除非是常见的缩写或简写形式。
5.常量命名-使用全大写字母和下划线的命名方式命名常量。
-常量名要具有描述性，能够清晰表达其含义。
6.字符串引号-使用双引号（""）包裹字符串，避免使用单引号（''）。
7.条件判断和循环语句-在条件判断和循环语句中使用花括号（{}）包裹代码块，即使只有一行代码。
8.数据类型转换-使用严格相等运算符（===）进行数据类型和值的比较，避免使用弱相等运算符（==）。
三、组织结构规范1.文件和文件夹命名-文件和文件夹命名应该清晰明确，能够准确表达其内容。
-文件和文件夹的命名应使用小写字母、短划线和数字的组合，避免使用空格和特殊字符。
2.目录结构前端项目应该按照一定的目录结构进行组织，常见的目录结构如下：- src：项目源代码目录。
- assets：用于存放静态资源文件，如图片、字体等。
- styles：存放样式文件。
- scripts：存放脚本文件。
- pages：存放页面组件。
四、性能优化规范1.文件合并和压缩-将多个CSS和JS文件合并为一个文件，并进行压缩。
-使用工具和插件进行自动化合并和压缩操作。
2.图片优化- 使用适当的图像格式，如JPEG、PNG、WebP等，以提高图像加载速度。
前端开发规范文档前端开发是指在网站、网页或移动端应用的开发过程中，负责用户界面的设计和开发的工作。
一个良好的前端开发规范可以提高团队的工作效率、降低错误率，并且方便后期的维护和扩展。
本文将介绍一些常见的前端开发规范。
一、HTML规范2.使用正确的缩进和格式：使用合适的缩进和换行，使HTML代码易于阅读和维护。
4. 使用语义化的类名和id名：类名和id名应该能够准确描述元素的作用和功能，避免使用无意义的名称。
二、CSS规范2. 避免使用!important：尽量避免使用!important来覆盖样式，应优先考虑调整选择器的优先级。
3.使用合适的样式复用方式：避免重复的代码，可以使用类名或父子选择器来复用样式。
4. 使用合适的尺寸单位：根据具体情况选择合适的尺寸单位，如px、em、rem等。
5. 使用CSS预处理器：可以使用Sass、Less或Stylus等CSS预处理器来提高开发效率和代码的可维护性。
三、JavaScript规范1. 使用严格模式：在JavaScript代码的开头使用"use strict"启用严格模式，以减少错误和提高代码质量。
2.使用合适的命名规范：变量、函数和类名应该具有描述性的名称，遵循驼峰命名法或下划线分隔符。
3.避免全局变量污染：尽量避免使用全局变量，可以通过使用模块化的方式来封装代码，或者使用命名空间。
4. 避免使用eval和with：避免使用eval函数和with语句，它们可能会引起安全问题和性能问题。
5.使用合适的循环和控制结构：使用合适的循环和控制结构来提高代码的可读性和性能，避免过多嵌套的层级。
四、代码管理规范1. 使用版本控制工具：使用Git等版本控制工具来管理代码的版本，方便团队协作和代码的追踪和回滚。
2.编写有意义的提交信息：每次提交代码时，应编写有意义的提交信息，描述本次提交的内容和目的。
3.周期性地进行代码审查：定期进行代码审查，发现和修复潜在的问题，提高代码质量和稳定性。
解释权文档摘要版本管理目录1.1CSS原理 (3)1.2文件规范 (4)1.3注释规范 (5)1.4命名规范 (6)1.4.1基础命名规则 (6)1.4.2常用的id命名 (7)1.4.3常用的class命名 (8)1.5书写规范 (8)1.5.1排版规范 (8)1.5.2属性编写顺序 (9)1.5.3规则书写规范 (10)1.5.4代码性能优化 (10)1.5.5CSS Hack的使用 (16)1.5.6字体规则 (16)1.6其他规范 (17)1.7测试规范 (17)1.7.1了解浏览器特效支持 (17)1.7.2设定浏览器支持标准 (17)1.7.3常用样式测试工具 (18)2.JSP (19)2.1文件目录 (19)2.2文件命名 (19)2.3页面编码规范 (20)3.JS (35)没有一种规范，就像一盘散沙；这种自由，会让自己写的东西时常变化。
也很不利于团队协作开发。
添加必要的注释，对一个有责任心、有道德模范的前端必须具备的好习惯，可以大大提高代码的可维护性、可读性。
1.CSS1.1CSS原理CSS全称为“Cascading Style Sheets”层叠样式表。
页面的标准－“WEB标准”注：X(HTML)用来决定网页的结构和内容。
CSS用来设定网页的表现形式。
JavaScript用来控制网页的行为浏览器是如何渲染页面和加载页面为什么有些网站打开的时候会加载会很慢，而且是整个页面同时显示的，而有些网站是从顶到下逐步显示出来的？要搞懂这个可以先从下面这个常规流程开始： 1. 浏览器下载的顺序是从上到下，渲染的顺序也是从上到下，下载和渲染是同时进行。
2. 在渲染到页面的某一部分时，其上面的所有部分都已经下载完成（并不是说所有相关联的元素都已经下载完）。
3. 如果遇到语义解释性的标签嵌入文件（JS 脚本，CSS 样式），那么此时IE 的下载过程会启用单独连接进行下载。
4. 并且在下载后进行解析，解析过程中，停止页面所有往下元素的下载。
解释权文档摘要版本管理目录1.1CSS原理 (3)1.2文件规范 (4)1.3注释规范 (5)1.4命名规范 (6)1.4.1基础命名规则 (6)1.4.2常用的id命名 (7)1.4.3常用的class命名 (8)1.5书写规范 (8)1.5.1排版规范 (8)1.5.2属性编写顺序 (9)1.5.3规则书写规范 (10)1.5.4代码性能优化 (10)1.5.5CSS Hack的使用 (16)1.5.6字体规则 (16)1.6其他规范 (17)1.7测试规范 (17)1.7.1了解浏览器特效支持 (17)1.7.2设定浏览器支持标准 (17)1.7.3常用样式测试工具 (18)2.JSP (19)2.1文件目录 (19)2.2文件命名 (19)2.3页面编码规范 (20)3.JS (35)没有一种规范，就像一盘散沙；这种自由，会让自己写的东西时常变化。
也很不利于团队协作开发。
添加必要的注释，对一个有责任心、有道德模范的前端必须具备的好习惯，可以大大提高代码的可维护性、可读性。
1.CSS1.1CSS原理CSS全称为“Cascading Style Sheets”层叠样式表。
页面的标准－“WEB标准”注：X(HTML)用来决定网页的结构和内容。
CSS用来设定网页的表现形式。
JavaScript用来控制网页的行为浏览器是如何渲染页面和加载页面为什么有些网站打开的时候会加载会很慢，而且是整个页面同时显示的，而有些网站是从顶到下逐步显示出来的？要搞懂这个可以先从下面这个常规流程开始： 1. 浏览器下载的顺序是从上到下，渲染的顺序也是从上到下，下载和渲染是同时进行。
2. 在渲染到页面的某一部分时，其上面的所有部分都已经下载完成（并不是说所有相关联的元素都已经下载完）。
3. 如果遇到语义解释性的标签嵌入文件（JS 脚本，CSS 样式），那么此时IE 的下载过程会启用单独连接进行下载。
4. 并且在下载后进行解析，解析过程中，停止页面所有往下元素的下载。
web开发规范Web开发是一项繁琐且复杂的任务，开发人员需要遵守一些规范来保证代码的质量和可维护性。
下面是一些常见的web开发规范，帮助开发人员编写更好的代码。
1. 使用正确的HTML结构：确保HTML文档正确地使用各种标签和元素，并遵循语义化的HTML结构。
避免使用过时的标签和元素，并确保文档结构清晰有序。
2. 使用外部CSS和JavaScript：将CSS和JavaScript代码从HTML文档中分离出来，使用外部文件进行引用。
这样可以使代码更具可维护性，并提高页面加载速度。
3. 遵循CSS命名约定：使用有意义的命名来定义CSS类和ID，避免使用不清晰的缩写和简单的命名。
命名应该清晰明确，并且易于理解和扩展。
4. 使用CSS预编译器：使用CSS预编译器如Less或Sass来帮助组织和管理CSS代码。
预编译器可以提供更好的代码结构和可重用性。
5. 管理JavaScript代码：使用模块化的JavaScript代码来避免全局命名冲突。
可以使用工具如Webpack或Browserify来打包和管理JavaScript模块。
6. 代码缩进和格式化：使用一致的缩进和格式化风格来使代码易读和一致。
可以使用工具如ESLint或Prettier来自动格式化代码。
7. 处理错误和异常：使用try-catch语句来处理可能发生的错误和异常。
捕获错误并适当地处理它们，以避免应用程序崩溃或产生意外的结果。
8. 代码注释：在代码中加入适当的注释来解释代码的目的和功能。
注释可以帮助其他开发人员理解代码，以及在以后修改代码时的参考。
9. 版本控制：使用版本控制系统如Git来管理和追踪代码的变化。
这可以帮助团队协作，管理不同的代码版本，并恢复或合并代码变更。
10. 测试和调试：编写自动化测试来验证代码的正确性，并使用调试工具来跟踪代码的执行过程。
这可以帮助发现和修复代码中的潜在问题。
11. 优化性能：优化Web应用程序的性能是一个重要的任务。
前端开发设计规范文档1.前言前端开发是构建用户界面的过程，它的设计和编写需要遵循一定的规范，以保证代码的可读性、可维护性和可扩展性。
本文档旨在提供一个前端开发的设计规范，帮助开发人员在设计和编写前端代码时遵循统一的规范。
2.命名规范2.1文件和文件夹命名-文件名使用小写字母，单词之间可以使用连字符“-”连接。
-文件夹名同样使用小写字母，单词之间使用连字符“-”连接。
2.2变量和函数命名- 变量和函数名使用驼峰命名法，即第一个单词首字母小写，后面的单词首字母大写。
例如：userInfo, getUserInfo。
2.3CSS类命名- CSS 类名使用连字符“-”连接，例如：main-container, login-button。
3.HTML规范3.2嵌套规范-HTML元素的嵌套应该保持良好的层次结构，不要过深嵌套。
-使用缩进保持结构清晰，增加代码的可读性。
4.CSS规范4.1使用外部样式表-将CSS样式写在外部样式表中，使代码可重用和维护。
4.2避免使用行内样式-避免在HTML元素上使用行内样式定义样式。
4.3样式规则的书写顺序-将样式规则按照从上到下的顺序书写，以保持结构清晰。
-先定义通用样式，再定义特定样式。
-按照样式的属性顺序书写，例如先写字体相关，再写颜色相关。
4.4使用CSS预处理器-使用CSS预处理器（如SASS或LESS）来提高CSS代码的可维护性和可扩展性。
5. JavaScript 规范5.1使用严格模式- 在 JavaScript 文件的开头添加 "use strict" 来启用严格模式。
5.2使用语义化的命名-使用有意义的变量和函数名，易于理解和维护。
5.3避免全局变量和函数-尽量避免使用全局变量和函数，以减少命名冲突和代码污染。
5.4缩进和空白符-使用合适的缩进和空白符来增加代码的可读性。
5.5注释规范-使用注释解释代码的意图和功能。
-在复杂的代码块前添加注释，帮助其他开发人员理解代码逻辑。
Web前端开发规范手册 一、规范目的 1.1 概述1 二、文件规范
2.1文件命名规则...1 2.2文件存放位置2 2.3css书写规范3 2.4html书写规范7 2.5JavaScript书写规范11 2.6图片规范12 2.7注释规范13 2.8css浏览器兼容13 一、规范目的 1.1 概述 为提高团队协作效率,便于后台人员添加功能及前端后期优化维护,输出高质量的文档,特制订此文档.本规范文档一经确认,前端开发人员必须按本文档规范进行前台页面开发.本文档如有不对或者不合适的地方请及时提出,经讨论决定后可以更改此文档.
二、文件规范
2.1文件命名规则 文件名称统一用小写的英文字母、数字和下划线的组合，其中不得包含汉字、空格和特殊字符；命名原则的指导思想一是使得你自己和工作组的每一个成员能够方便的理解每一个文件的意义，二是当我们在文件夹中使用“按名称排例”的命令时，同一种大类的文件能够排列在一起，以便我们查找、修改、替换、计算负载量等等操作。 a.HTML的命名原则 引文件统一使用index.htmindex.htmlindex.asp文件名（小写） 各子页命名的原则首先应该以栏目名的英语翻译取单一单词为名称。例如： 关于我们\aboutus 信息反馈\feedback 产品\product 如果栏目名称多而复杂并不好以英文单词命名，则统一使用该栏目名称拼音或拼音的首字母表示； 每一个目录中应该包含一个缺省的html文件，文件名统一用index.htmindex.htmlindex.asp；
b.图片的命名原则 图片的名称分为头尾两部分，用下划线隔开，头部分表示此图片的大类性质 例如：广告、标志、菜单、按钮等等。 放置在页面顶部的广告、装饰图案等长方形的图片取名：banner 标志性的图片取名为：logo 在页面上位置不固定并且带有链接的小图片我们取名为button 在页面上某一个位置连续出现，性质相同的链接栏目的图片我们取名：menu 装饰用的照片我们取名：pic 不带链接表示标题的图片我们取名：title 范例：banner_sohu.gifbanner_sina.gifmenu_aboutus.gifmenu_job.giftitle_news.giflogo_police.giflogo_national.gifpic_people.jpg 鼠标感应效果图片命名规范为"图片名+_+on/off"。 例如：menu1_on.gifmenu1_off.gif
c.javascript的命名原则 例如：广告条的javascript文件名为ad.js弹出窗口的javascript文件名为pop.js
d.动态语言文件命名原则 以性质_描述，描述可以有多个单词，用“_”隔开，性质一般是该页面得概要。 范例：register_form.aspregister_post.asptopic_lock.asp
2.2文件存放位置规范
_Root cn 存放中文HTML文件 en 存放英文HTML文件 flash 存放Flash文件 images 存放图片文件 imagestudio 存放PSD源文件 flashstudio 存放flash源文件 inc 存放include文件 library 存放DW库文件 media 存放多媒体文件 project 存放工程项目资料 temp 存放客户原始资料 js 存放JavaScript脚本 css 存放CSS文件 2.3CSS书写规范
基本原则： CSS样式可细分为3类：自定义样式、重新定义HTML样式、链接状态样式。 1. 样式为设计师自定义的新CSS样式，影响被使用本样式的区域，用于完成网页中局部的样式设定。样式名“.”+“相应样式效果描述的单词或缩写”例：“.shadow” 2. 文字样式样式名“.no”+“字号”+“行距”+“颜色缩写”例：“.no12”、“.no12-24” 2.义HTML样式为设计师重新定义已有的HTML标签样式，影响全部的被设定标签样式，用于统一网页中某一标签的样式定义。样式名“HTML标签”例：hr{border:1pxdotted#333333} 3.态样式为设计师对链接不同状态设定特殊样式，影响被使用本样式区域中的链接。 该样式写法有2种：a.nav:linknav.a:link第一种只能修饰标签中；第二种可以修饰所有包含有标签的其他标签。 页面内的样式加载必须用链接方式 注意细则： 1. 协作开发及分工:i会根据各个模块,同时根据页面相似程序,事先写好大体框架文件,分配给前端人员实现内部结构&表现&行为;共用css文件base.css由i书写,协作开发过程中,每个页面请务必都要引入,此文件包含reset及头部底部样式,此文件不可随意修改; 2. class与id的使用:id是唯一的并是父级的,class是可以重复的并是子级的,所以id仅使用在大的模块上,class可用在重复使用率高及子级中;id原则上都是由我分发框架文件时命名的,为JavaScript预留钩子的除外; 3. 为JavaScript预留钩子的命名,请以js_起始,比如:js_hide,js_show; 4. class与id命名:大的框架命名比如header/footer/wrapper/left/right之类的在2中由i统一命名.其他样式名称由小写英文&数字&_来组合命名,如i_comment,fontred,width200;避免使用中文拼音,尽量使用简易的单词组合;总之,命名要语义化,简明化. 5. 规避class与id命名(此条重要,若有不明白请及时与i沟通): a,通过从属写法规避,示例见d; b,取父级元素id/class命名部分命名,示例见d; c,重复使用率高的命名,请以自己代号加下划线起始,比如i_clear; d,a,b两条,适用于在2中已建好框架的页面,如,要在2中已建好框架的页面代码中加入新的div元素, 按a命名法则:..., 样式写法:#mainnav.firstnav{.......} 按b命名法则:..., 样式写法:.main_firstnav{.......} 6. css属性书写顺序,建议遵循布局定位属性-->自身属性-->文本属性-->其他属性.此条可根据自身习惯书写,但尽量保证同类属性写在一起.属性列举:布局定位属性主要包括:margin、padding、float（包括clear）、position（相应的top,right,bottom,left）、display、visibility、overflow等；自身属性主要包括:width&height&background&border;文本属性主要包括：font、color、text-align、text-decoration、text-indent等；其他属性包括:list-style(列表样式)、vertical-vlign、cursor、z-index(层叠顺序)、zoom等.我所列出的这些属性只是最常用到的,并不代表全部; 7. 书写代码前,考虑并提高样式重复使用率; 8. 充分利用html自身属性及样式继承原理减少代码量,比如: 这儿是标题列表2010-09-15 定义ul.listli{position:relative}ul.listlispan{position:absolute;right:0} 即可实现日期居右显示 9. 样式表中中文字体名,请务必转码成unicode码,以避免编码错误时乱码; 10. 背景图片请尽可能使用sprite技术,减小http请求,考虑到多人协作开发,sprite按模块制作; 11. 使用table标签时(尽量避免使用table标签),请不要用width/height/cellspacing/cellpadding等table属性直接定义表现,应尽可能的利用table自身私有属性分离结构与表现,如thead,tr,th,td,tbody,tfoot,colgroup,scope;(cellspaing及cellpadding的css控制方法:table{border:0;margin:0;border-collapse:collapse;}tableth,tabletd{padding:0;},base.css文件中我会初始化表格样式) 12. 杜绝使用兼容ie8; 13. 用png图片做图片时,要求图片格式为png-8格式,若png-8实在影响图片质量或其中有半透明效果,请为ie6单独定义背景: src=’img/bg.png’); 14. 避免兼容性属性的使用,比如text-shadow||css3的相关属性; 15. 减少使用影响性能的属性,比如position:absolute||float; 16. 必须为大区块样式添加注释,小区块适量注释; 17. 代码缩进与格式:建议单行书写,可根据自身习惯,后期优化i会统一处理; 命名规则：
头：header 内容：content/container 尾：footer 导航：nav 侧栏：sidebar 栏目：column 页面外围控制整体布局宽度：wrapper
