使用变量作为HTML中的类

我在我的SASS文件中有几个变量，我想直接在我的HTML中使用它们作为类或样式。我知道我可以使用映射函数，但是，它非常乏味。有没有其他方法可以实现它？简单的方法？使用变量作为HTML中的类

例如：

青菜文件：

$margin-base-vertical:30px 0;

HTML文件：

<div class="some-container margin-base-vertical"> 
some things 
</div>

2014-09-24 JovStern

通常你会创建一个新的类此，如：'.margin基垂直{保证金：$与容限碱基垂直; }'。你可以使用list和mixins来进行某种自动化。很难回答你的问题给出的信息。 – 2014-09-24 08:40:51

这不是一个好主意。如果你使用描述样式的类，你最终会得到一个真正不可行的代码。每次你想改变你的风格，你都必须改变标记（HTML）和CSS。

最好的做法是使用语义标记。

这是青菜原来真的很强大，你可以用你的变量像这样：

.some-container { 
    margin: $margin-base-vertical; 
}

编辑：

我能想到的关于您的问题，唯一的选择，就是声明变量，然后在您的课堂上使用它，之后，您将拥有需要用于标记的课程。

SASS文件

$margin-base-vertical: 30px 0; 
.margin-base-vertical { margin: $margin-base-vertical; }

HTML

<div class="some-container margin-base-vertical"> 
some things 
</div>

2014-09-24 09:16:12 avcajaraville

我听到你在说什么，但有时候你想要几个类在HTML中玩，而不是像我的情况那样触及你的CSS。我在其他地方使用了类似于你的建议的变量，但是，我正在寻找像我问的那样以不同的方式使用它们。 – JovStern 2014-09-25 08:56:12

我在这些情况下做的只是在sass上创建一个类，然后在标记中使用它。 CSS和HTML生活在平行世界中，没有办法完成你所要求的。但是你可以声明一个变量，在你的类中使用它，然后在你的标记中使用它。请参阅我对我的回答所做的修改。 – avcajaraville 2014-09-25 09:43:01

回答