CSSでクラスのエイリアス(include)

サイトのメインカラーが#123456だとして、色々な場面でそのカラーを指定することになると思います。

.maincolor { background-color: #123456 }

body { background-color : .maincolorの色を設定 }
h3 { background-color : .maincolorの色を設定 }
ul.nav a:link { color : .maincolorの色を設定 }

このようにプロパティやクラスをincludeできればどんなに便利かと思います。
こんなことは不可能でしょうか。
不可能な場合、皆様はどのように管理されていますか？

No.2 ベストアンサー 回答者： kosukejlampnet 回答日時： 2012/08/02 21:49

LESSというものがあります。

http://www.webopixel.net/html-css/503.html

この回答へのお礼

これは素晴らしい！ありがとうございます。
質問の意図を理解していただいて感謝です。BAにさせていただきます。

知らなかったのですが、CSSで変数が使えるドラフトが上がっているようですね。

CSSで変数を利用可能に。W3Cが「CSS Variables Module Level 1」ドラフトを公開
http://www.publickey1.jp/blog/12/cssw3ccss_varia …

実装が待ち遠しいです。LESSの階層化も提案されるといいですね。

お礼日時：2012/09/28 19:54

No.3 回答者： ORUKA1951 回答日時： 2012/08/03 10:41

.maincolor { background-color: #123456 }

body { background-color : .maincolorの色を設定 }
h3 { background-color : .maincolorの色を設定 }
ul.nav a:link { color : .maincolorの色を設定 }

よりは
body,h3,ul.nav a:link{background-color:#123456;}
のほうが簡単ですし・・・

No.1 回答者： ORUKA1951 回答日時： 2012/08/02 19:28

なぜclass指定の必要があるのですか？

外部スタイルシートで
<link rel="stylesheet" type="text/css" media="screen" href="./styleSheet/standard.css">

とか指定しておけばよい。

優先スタイルシート(preferred style sheet)--title属性を持たない--を外部スタイルシートで置けば良いです。

＞body { background-color : .maincolorの色を設定 }
＞h3 { background-color : .maincolorの色を設定 }
＞ul.nav a:link { color : .maincolorの色を設定 }
background-colorプロパティは継承しませんが、デフォルトがtransparentなので、このように記述する必要がありません。
【引用】＿＿＿＿＿＿＿＿＿＿＿＿ここから
'background-color'
　Value: <color> | transparent | inherit
　Initial: transparent
　Applies to: all elements
　Inherited: no
　Percentages: N/A
　Media: visual
￣￣￣￣￣￣￣￣￣￣￣￣￣ここまで［色と背景( http://www.swlab.it.okayama-u.ac.jp/man/rec-css2 … )］より

また、colorプロパティは継承しますから、やはり記述する必要がありません。
【引用】＿＿＿＿＿＿＿＿＿＿＿＿ここから
'color'
　Value: <color> | inherit
　Initial: depends on user agent
　Applies to: all elements
　Inherited: yes
　Percentages: N/A
　Media: visual
￣￣￣￣￣￣￣￣￣￣￣￣￣ここまで［色と背景( http://www.swlab.it.okayama-u.ac.jp/man/rec-css2 … )］より

　継承しないプロパティを継承させる必要があるときは、inheritと記述します。

＞このようにプロパティやクラスをincludeできればどんなに便利かと思います。
　カスケーディングスタイルシート(CSS)を使われているのでしたら、それが使われる理由がカスケーディングにあることはご存知だと思います。
　とても強力でわかりやすい--常識的にも理解しやすい仕組みです。
　それが便利だから使っているのですよ。
　　---プロパティより先に身につけておくべきです。

＞こんなことは不可能でしょうか。
　不必要ですからありません。CSSではなく他のスタイルシート(XSLT)などを使えばできるでしょうけど、その必要はまったくありません。