精简高效的CSS命名准则和方法（3）
作者：zhangxinxu 来源：zhangxinxu 发布时间：2010-09-17 18:38:00
我在“CSS样式分离之再分离”一文中就展示过这种命名了，分离为什么可以让样式的重用性放大至最大，就是因为分离后样式的命名就是样式本身。
就拿上面人人网的标题样式举例，人人网的做法是：
.side-item-header{padding:0 0 8px; text-align:right;}
要是我，我会对其进行分离。在实际项目时，text-align:right;这个属性早就在CSS通用样式库里面了，而padding:0 0 8px;则会以padding-bottom:8px;的形式放在网站通用样式库里了（详细请参见我的“我是如何对网站CSS进行架构的”一文）。最后，CSS命名与样式会如下：
.tr{text-align:right;}
.pb8{padding-bottom:8px;}
而这里分离出来的样式又可以被其他地方使用。是不是有点“吸星 * ”的感觉。
当然，如果网站本身的架构不是对每个侧栏内容进行模块化处理的话，说实话，这里标题的分离还是有点危险的。想想看，如果那天产品经理说底部padding值要改成10像素，啊哦，如果你的网站架构不合理，含这类标题的模块到处塞，会改到你急火攻心，吐血三升而亡的。所以，对于分离，我反复强调，“千万不要对网站通用的元素进行分离”。
所以，记住精简高效的CSS命名准则之一：对于网站非通用元素，如果样式简单(1~2个属性)，对其分离并使用面向属性的命名方法。
四、精简高效CSS命名之“三无原则”
此“三无原则”就是：无ID，无层级，无标签
CSS命名就应该最简单、最直接，直捣黄龙。没有HTML标签，没有层级，这些通通滚蛋，不要。为什么不要，有三大原因：
1. 限制重用
我们会使用层级(#test .test)，会使用标签(ul.test)，可能是习惯(没多想)，或是为了避免冲突。但是，我跟你说，从今以后，这种写法让他见鬼去吧（如果不是为了改变CSS优先级的话）。正如开篇论述的哲学观点，你限制越多，越抑制了CSS的重用性。例如#test .test{}这种写法，里面的CSS重用性多大，完全限死在了id为test的元素下，哪有重用性可言；又如ul.test，我勒个去，这个ul标签十有八九就是装饰用的，往这儿一放，同样CSS样式的div标签可以用吗？哭爹喊娘，眼泪汪汪也不管用啊。所以，相信我，层级啊，标签啊什么的，通通见鬼去吧。
要知道，层级啊，标签啊作用是什么，是用来提高CSS优先级，把那个字母长的让人发毛的”!important”干掉的。
0
投稿猜你喜欢
左右结构是平常页面中最经常看到的结构，简洁一些的页面就会使用边框将左右两边隔开，但往往由于左右两边的内容可能是不等高的，所以就会有一高一低的- Access允许您在数据库表中包含附件。通过利用微软的对象链接和嵌入(OLE)技术，您可以将照片、图表、文档及其他文件存储在您的Access
- 当我们使用一个数据库时，总希望数据库的内容是可靠的、正确的，但由于计算机系统的故障（包括机器故障、介质故障、误操作等），数据库有时也可能遭到
- 网站标准（或称“WEB标准”）对于每一个开发网站和做网页的人来说，都是不可忽视的，这不仅是一个潮流，而是一个标准，一个更加符合规范的做法，而
- 只要不是HTTP_REFERER来源于（google.com google.cn *.google.com *.google.cn baid
- 姓名的翻译： 英语是名(First name)在前，姓(Last name)在后。中文地址的翻译：如果你英语水平不高，填表时只要国家名用英语
- 但是如果是让你接手一个二等残废的网站，并让你在上面改版，而且不能推翻式改版，只能逐步替换旧的程序，那么你会非常痛苦，例如我遇到的问题： 问题
- 在做数据库备份和还原数据库的时候出现"错误2812:未能找到存储过程’master.dbo.xp_fileexist’"
- <script>function getJsFile(url, callBack){
- 本文介绍的MySQL数据库的出错代码表，依据MySQL数据库头文件mysql/include/mysqld_error.h整理而成。详细内容
- asp使用session来防止表单多次被提交的方法。formtest.asp' 表单文件<％Randomize&nb
- 因为自己在设计的时候就对这些东西经常不是很在意，以为是很小的事情，结果往往给自己搞出不少的麻烦。可能大家没有我这么粗心，不过还是想提醒一下跟
- 之前用Crystal做了一个数字转English Word的Formula刚刚心血来潮, 大半个晚上写了JS版本的数字转换, 由于JS的Bu
- 如何用METADATA替换ADOVBS.INC？ 在ASP中，使用组件时，如ADO，得先包含
- 从2003年到现在，从ACCESS到SQL SERVER的使用。在ACCESS中没有存储过程的概念。在使用过程中，发现ACCESS与SQL
- 在标志设计中文字与图形元素总是紧密配合，只有恰当的字体与图形搭配时才能发挥最大的视觉效果。这也意味着你不能抛开图案，只是一厢情愿地选择你自己
- 使用ASP生成图片彩色校验码49行代码,三个文件 Asp文件：Co
- 现将几种主要情况进行小结： 一、如何输入NULL值 如果不输入null值，当时间为空时，会默认写入"1900-01-01"
- 1. 排序有什么用“排序”这个专业名词原本是来源于计算机程序操作中的，是一种很常见的算法设计，当然，对交互设计来说，探讨冒泡排序和堆排序之间
- 在开发WEB应用程序中，我们经常需要对文件系统中的驱动器、文件夹和文件进行处理，比如收集驱动器的相关信息；创建、添加、移动或删除文件夹和文件
