0

オブジェクト指向のCSSに変換しようとしています。私は色を定義しようとしています：

/* COLOURS */
.gray5: { color: #4C4C4C; }
.gray4: { color: #333333; }
.gray3: { color: #999999; }
.gray2: { color: #808080; }
.gray1: { color: #F5F5F5; }
.white: { color: #FFFFFF; }

問題は、このように色を定義したいのですが、このようにテキストの色しか定義できないことです。テキストまたはdivのいずれかでこの「色」定義を使用できるようにすることはできませんか? 私はむしろこのようにする必要はありません....：

/* DIV COLOURS */
.gray5: { background-color: #4C4C4C; }
.gray4: { background-color: #333333; }
.gray3: { background-color: #999999; }
.gray2: { background-color: #808080; }
.gray1: { background-color: #F5F5F5; }
.white: { background-color: #FFFFFF; }

/* TEXT COLOURS */
.tgray5: { color: #4C4C4C; }
.tgray4: { color: #333333; }
.tgray3: { color: #999999; }
.tgray2: { color: #808080; }
.tgray1: { color: #F5F5F5; }
.twhite: { color: #FFFFFF; }

ご意見ありがとうございます。

4

1 に答える 1

2

現在、初期の仕様フェーズを通過している CSS 変数仕様があり、この種の作業に役立ちます (SASS や LESS と同じ方法で)。

ただし、ブラウザがそれをサポートするまでにはしばらく時間がかかり、現実の世界で使用できるほど十分な数のブラウザがサポートするまでにはさらに時間がかかります。それまでは、SASS と LESS が最善の策です。

参照：

于 2012-10-06T19:42:47.750 に答える