如何处理CSS类中的负数

Question

假设您的默认值为0，并且某个数字会上升和下降，例如-12到12左右。你会如何为每个值编写每个类？积极是简单的（例如.foo-bar-3为3），但负面如何？

我想出了一些选择：

1. .foo-bar--12适用于-12，类名为-12
{li> .foo-bar-m12代表-12而m代表 m inus {li> .foo-bar-12n为-12后缀为 n egative 的n {li> .foo-bar-n12 -12 {strong} n 的n前缀

有什么想法吗？

Answer 1

我宁愿使用一个名称来描述类的目的，而不是它的风格。以后您可能想要改变您的测量值，但该类的特定目的可能保持不变。此外，您可以通过查看其值来“看到”它正在做的类。所以：

.this-do-this {property: value;}
.another-purpose {property: value;}
.negative-something {property: value;}

只需更改类名称即可描述该类正在执行的操作，而不是将应用的具体测量值;属性/值对将会这样做。

Answer 2

我真的要根据它的风格来命名类而不是它的用法（不推荐使用它），然后使用“负面”这个词。大多数时候都很清楚。比如.negative-margin-14px，.negative-indent-1em等。