1 / 11
文档名称:

移动端手机前端css命名规范.docx

格式:docx   大小:142KB   页数:11页
下载后只包含 1 个 DOCX 格式的文档,没有任何的图纸或源代码,查看文件列表

如果您已付费下载过本站文档,您可以点这里二次下载

分享

预览

移动端手机前端css命名规范.docx

上传人:1uu2qphh09 2017/3/6 文件大小:142 KB

下载得到文件列表

移动端手机前端css命名规范.docx

相关文档

文档介绍

文档介绍:手机前端 CSS 命名规范一、文件规范 1 、文件均归档至约定的目录中。具体要求通过豆瓣的 CSS 规范进行讲解: 所有的 C SS 分为两大类:通用类和业务类。通用的 C SS 文件,放在如下目录中: ?基本样式库/css/core ?通用 UI 元素样式库/css/lib ? JS 组件相关样式库/css/ui 业务类的 CSS 是指和具体产品相关的文件, 放在如下目录中: ?读书/css/boo k/ ?电影/cs s/movie/ ?音乐/css/mu sic/ ?社区/ css/sns/ ?小站/css/si te/ ?同城/c ss/locatio n/ ?电台/cs s/radio/ 外联 CSS 文件适用于全站级和产品级通用的大文件。内联 CSS 文件适用于在一个或几个页面共用的 CSS 。另外一对具体的 CSS 进行文档化的整理。如: ? util-01 r eset /css/ core/reset .css ? util -02 通用模块容器/css/core / ? ui-01. 喜欢按钮/css/cor e/fav_btn. css ? ui-02 . 视频/ 相册列表项/css/core /media_ite ? ui- 03. 评星/cs s/core/rat ?u i-04. 通用按钮/css/core /common_bu ? ui-05. 分页/css/core/ pagination .css ? ui-0 6. 推荐按钮/c ss/core/re ? ui-07. 老版对话框/css/c ore/old_di ? ui-08. 老版 T ab /css/co re/old_tab .css ? ui-0 9. 老版成员列表/css/core/ old_userli ? ui -10. 老版信息区/css/core / s ? ui-11. 社区用户导航/cs s/core/pro ss ? ui-12. 当前大社区导航/ css/core/s s ? ui-13. 加载中/css/l ib/loading .css 2 、文件引入可通过外联或内联方式引入。?外联方式:(类型声明 type =” text/css ”可以省略) ?内联方式:(类型声明 ty pe= ” text/c ss”可以省略) ? link 和 style 标签都应该放入 hea d 中,原则上,不允许在 html 上直接写样式。避免在 CSS 中使用***@import ,嵌套不要超过一层。 3 、文件名、文件编码及文件大小?文件名必须由小写字母、数字、中划线组成?文件必须用 UTF-8 编码,使用 UTF-8 (非 BO M),在 HTML 中指定 UTF-8 编码, 在 CSS 中则不需要特别指定因为默认就是 UT F-8 。?单个 CS S 文件避免过大(建议少于 300 行) 二、注释规范 1 、文件顶部注释(推荐使用) /* * ***@des cription: 中文说明* ***@au thor: name * ***@update : name (20 13-04-13 1 8:32) */ 2 、模块注释/* module: mo dule1 by 张三*/ …/* module: mo dule2 by 张三*/ 模块注释必须单独写在一行 3、单行注释与多行注释/* this isa ment */ 单行注释可以写在单独一行,也可以写在行尾,注释中的每一行长度不超过 40 个汉字,或者 80 个英文字符。/* * thi s me nt line 1. * this ment l ine 2. */ 多行注释必须写在单独行内 4 、特殊注释/* TODO: x xxx by nam e 2013-04- 13 18:32 */ /* BUGFI X: xxxx by name 2012 -04-13 18: 32 */ 用于标注修改、待办等信息 5 、区块注释/* H eader */ /* Footer */ /* Galle ry */ 对一个代码区块注释(可选) ,将样式语句分区块并在新行中对其注释。三、命名规范使用有意义的或通用的 ID 和 class 命名: ID 和 class 的命名应反映该元素的功能或使用通用名称,而不要用抽象的晦涩的命名。反映元素的使用目的是首选;使用通用名称代表该元素不表特定意义, 与其同级元素无异,通常是用于辅助命名;使用功能性或通用的名称可以更适用于文档或模版变化的情况。?/* 不推荐: 无意义*/ #yee