從元素屬性動態創建css規則

-1

雖然通過SASS/LESS文檔，但找不到任何我在尋找的東西。我正在開發一個AngularJS應用程序，它有許多動態的預定義樣式（比如CMS）。從元素屬性動態創建css規則

是否可以使用CSS3/LESS/SASS/Anything從元素屬性動態創建CSS規則 - 在瀏覽器中？

我知道我可以做線內造型，但是我對它不太舒服 - 必須有更好的方法！

從以下HTML

<div id="el" animation-time="3"></div>

創建下面的CSS：
#el { transition: 3s linear all; }

我看到的線下使用的一些例子，讓我的希望很高：

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

2014-08-27 Iladarsda

所以你不舒服的內嵌樣式，但是你完全沒有用'字體大小=「32」'？ – BoltClock 2014-08-27 14:50:20

@BoltClock內聯樣式感覺就像我在1995年回來;）我完全理解代碼量是相同的，但我打算做一些CSS動畫等。所以LENGTH變量作爲屬性將是完美的。 – Iladarsda 2014-08-27 14:55:50

-1 css應該設置html樣式。使用HTML風格的CSS風格的HTML是一個壞主意。 – 2014-08-27 14:56:24

您可以創建一個列表如下：

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

作者日期的紙條評論：

2014-08-27 14:59:02

您必須標識HTMLNode。所以這可能工作：

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

隨着

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

2014-08-27 15:20:45

我不認爲這將有助於您在CSS中需要唯一的ID。 – 2014-08-27 15:22:18

CSS表達式無處不在：http://stackoverflow.com/questions/6191679/css-expressions – cimmanon 2014-08-27 15:37:17

回答