Css最佳实践困境 - 具体案例

Question

客户端要求提供管理表，并且根据某些规则，一列将具有不同的单元格颜色。

我的问题是：最好的css练习是什么。

• 我们知道内联从一开始就很糟糕
• 我们可以为每种颜色做一些css类，并给它们一个好名字，但这只会使主要的css文件混乱，其中的类可能永远不会再次使用。

那么这个简单问题的好方法是什么？

Answer 1

  

那么这个简单问题的好方法是什么？

您基本上已经概述了两个选项。这是你的选择。

我会一直使用类，而不是内联CSS。如果您担心混乱，可以使用注释添加一些订单：

/** Table highlight styles **/

table.data td.highlight { background-color: #CCCCCC }
table.data td.total     { background-color: #ABCDEF }

理论上，您可以将这些文件放入单独的CSS文件中，但样式表的数量应尽可能低。要做到这一点，你可以使用@Ian ....建议的CSS预处理器，但这是一个完全不同的新蠕虫。

Answer 2

就个人而言，我建议使用像dotless（DotNet）或less（Ruby）这样的东西。

您可以在此处定义@MyMainColour之类的颜色，然后使用div.SomeBackground { background: @MyMainColour; }

这些工具将允许您“编译”CSS压缩并生成客户特定的主题。

Answer 3

您可以考虑：

保留单独的css文件以进行特定调整。这可能是保持主样式文件整洁，但仍能够通过调整来定位特定GUI的良好折衷。

让GUI具有id。这样，您可以让GUI特定调整仅影响具有上下文中给出的样式的GUI。