Angularjs 从元素属性动态创建css规则

浏览了SASS/LESS文档，但找不到我要查找的任何内容。我正在开发一个AngularJS应用程序，它有大量的动态预定义样式（想想CMS）

使用CSS3/LESS/SASS/Anything是否可以从浏览器中的元素属性动态创建CSS规则

我知道我可以做在线造型，但我对它不是很满意——一定有更好的方法

从下面的HTML

创建以下css:

#el{过渡：3s线性所有；}

我在网上看到了以下用法的一些例子，所以我的希望很高：

#container {
   min-width: 600px;
   width:expression(document.body.clientWidth < 600? "600px": "auto" );
}

#容器{
最小宽度：600px；
宽度：表达式（document.body.clientWidth<600？/600px）：“auto”）；
}

您可以创建如下列表：

*[font-size="0pt"] {font-size:0pt}
*[font-size="1pt"] {font-size:1pt}
*[font-size="2pt"] {font-size:2pt} ...

Autor对评论的注释：

• +100，永远不会被使用-感觉浪费

  ---

您必须识别HTMLNode。因此，这可能会起作用：

<div id="foobar" animation-time="3s"></div> 

---

因此，您对内联样式不太满意，但对

font size=“32”

？@BoltClock内联样式感觉就像回到了1995年；）我完全理解代码的数量是一样的，但我计划做一些CSS动画等。。所以长度变量作为一个属性是完美的。@PeterRader-最佳实践是否是共谋独立讨论；）您似乎将

标记的内联样式属性弄错了。后者可以追溯到1995年。前者直到'96/'97年才出现，直到21世纪初CSS开始成为主流，几乎没有人使用它。不管怎样，我都不相信你的论点——如果你觉得它太过时了，你为什么还要复制它呢？我真的要问，为什么这是必要的。如何仅一个特定实例需要一个特殊样式？在标记中放置样式信息会导致维护噩梦。无论是内联CSS、字体标记，还是看起来和闻起来都像但不是字体标记的东西。我认为这不会有帮助，因为您需要CSS中的唯一id。CSS表达式不适用于任何地方：

 div#foobar{
   transition-duration: expression(foobar.getAttribute('animation-time'));
 }