Html 重新格式化css-折叠冗余路径？

我的样式表往往有很多冗余。比如说,

/* example one: different attributes */
div#main_work > div.main_work table.data td span.rating,
div#main_work > div.main_work table.data td span.follow 
   { white-space: nowrap; vertical-align: center; }

/* example two: same upstream, different downstream */
div#main_work > div.main_work > form table,
div#main_work > div.main_work > table,
div#main_work > div.main_work div table
   { width: 100%; margin: 0px;  -moz-box-sizing: border-box; box-sizing: border-box; }

---

有没有一种语法正确的方法可以将其折叠起来？

好吧，我不知道您的html代码，但您可能可以去掉一些东西，以实际需要的元素为目标，避免过度规范。仅举一个例子，适合您的需要，但您得到了以下想法：

/* example one: different attributes */
.main_work .rating,
.main_work .follow 
   { white-space: nowrap; vertical-align: center; }

/* example two: same upstream, different downstream */
.main_work table,
.main_work form table,
.main_work div table
   { width: 100%; margin: 0px;  -moz-box-sizing: border-box; box-sizing: border-box; }

---

不，就是这样。您可以通过对事物不太具体来缓解一些麻烦，尤其是在ID选择器中：

/*示例一：不同的属性*/
#main\u work>.main\u work.data.rating，
#main\u work>.main\u work.data.跟随
{空白：nowrap；垂直对齐：中心；}
/*示例二：相同的上游，不同的下游*/
#主工作>主工作>表格，
#主工作>主工作>表，
#main\u work>。main\u work div表
{宽度：100%；边距：0px；-moz框大小：边框框；框大小：边框框；}

---

你可以进一步减少这个。尽量简洁明了地表达意图。作为另一种选择，您可以尝试。

谢谢您的回复。正如你可能想象的那样，由于缺乏专业知识而被严重咬了一口——我不想再去那里了——时间太长了，无法从混乱中挖掘出来。是的，

less

对某些人来说是一个有效的选项。@cYoung:过度指定更糟糕。相信我，简化你的表达。如果不这样做，至少可以从

div#main_work

中删除

div

。它是完全冗余的，会影响性能。同意从

div#main

中删除

div

——这肯定是过火了。但我感兴趣的是，为什么你的内容过于具体化更糟糕。从我的角度来看，过度指定属于过早优化。如果您首先考虑选择器，则不应出现指定不足的情况。如果您仍然不确定，请运行此测试。这是在jQuery中过度指定的测试，但在css中也会有类似的结果。谢谢，但从我的角度来看，过度指定是一种向管道中添加不必要字节的罪恶，而欠规范则是一种致命的罪恶，它注定了一个人要在调试css的炼狱中度过两三辈子。（向善良的天主教徒道歉）有点多余的问题。这就像说你有一袋弹珠，然后问你是否有可能挑一个绿色的，除非我们知道你有什么颜色/多少颗弹珠，否则我们怎么知道？CSS只能根据具体情况根据HTML进行简化，这使得问题过于本地化，或者在这种情况下，如果不查看HTML，就不可能进行简化。这就是说，埃尔克兰斯似乎给出了最合乎逻辑的简化。。。