电脑桌面
添加小米粒文库到电脑桌面
安装后可以在桌面快捷访问

腾讯式CSS命名规范

腾讯式CSS命名规范_第1页
1/9
腾讯式CSS命名规范_第2页
2/9
腾讯式CSS命名规范_第3页
3/9
CSS 文件就会比较繁琐,众多的选择符、属性让人眼花缭乱,那么如何更快的定位、如何更 高效的编写样式呢?CSS 的书写被很多人所忽略。关于书写风格,翻看了一些知名网站的作品,发现横向连排几乎成为各大产品项目的主流,然而,每个人对于 CSS 的写法各异,这就导致我们工作效率的降低。为了更好的协同工作,保持团队内 CSS 书写的一致性,几经波折后达成共识,具体书写方法如下:CSS 属性 横排书写,选择符纵排书写,每个”,”(逗号)后必须换行; 重构组代码书写规范示例:(其中数字只用做示范,实际应用中不建议用数字命名。) .class_name_1 .class_name_1_1, .class_name_2 .class_name_2_1 .class_name_2_1_1, .class_name_3{style1:value; style2:value; styel3:value; } 有人说,好代码就是用记事本打开也是艺术品,而样式文件本身就是设计作品。目前并没有一个权威来界定这种规范,我们只能对两种写法做个简单的总结。 就样式文件本身对比: 纵向书写特点:  每个 CSS 属性独立一行,一般不会出现换行或横向滚动条。  可以通过 firebug 等工具查找到模块,在 DW 中 ctrl+g 行定位,修改方便。  属性段落间有缩进,保证了代码的整洁,层次清楚,符合编程语言代码规范,修改更加直观。 存在的问题:代码冗余(如空格符、tab 符、换行符);文件大小增加;容易出现纵向滚动条。 横向书写特点:  最大化的利用了空间,单屏内能显示更多,减小了纵向滚动条出现的几率,能够快速捕获较多的信息。  减小了文件大小,省去了不必要的空格、换行等。  横向书写方便分块以及注释,便于查看 CSS 结构,选择符一目了然。当今显示器正朝着越来越大,越来越宽发展,基本上一行内可以显示完全。  加快编写 CSS 速度,不用每次敲换行和 tab,并且减少拉动滚动条的次数。  如果是活动页,不用作压缩处理。使用 CSS optimizers 来优化 CSS 是提倡的,但是使用横向书写,基本上不存在多余的空格和换行,因此可以不用压缩,这样效率和能力都会得到提高。  便于阅读和查找相关结构。代码编辑器对同行数定位做的都比较好,因此我们要解决的是如何快速纵向定位目标。横向书写时选择符纵向对齐,再加上 .class_name_2 .class_name_2_1 .class_name_2_1_1的选择符层次分明,因此很容易定位到目标。 在调试小 Bug 的时候就可以直接打开 CSS 更改,不用再打开 firebug 去找...

1、当您付费下载文档后,您只拥有了使用权限,并不意味着购买了版权,文档只能用于自身使用,不得用于其他商业用途(如 [转卖]进行直接盈利或[编辑后售卖]进行间接盈利)。
2、本站所有内容均由合作方或网友上传,本站不对文档的完整性、权威性及其观点立场正确性做任何保证或承诺!文档内容仅供研究参考,付费前请自行鉴别。
3、如文档内容存在违规,或者侵犯商业秘密、侵犯著作权等,请点击“违规举报”。

碎片内容

腾讯式CSS命名规范

确认删除?
VIP
微信客服
  • 扫码咨询
会员Q群
  • 会员专属群点击这里加入QQ群
客服邮箱
回到顶部