質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
CSS

CSSはXMLやHTMLで表現した色・レイアウト・フォントなどの要素を指示する仕様の1つです。

Q&A

解決済

2回答

3554閲覧

CSSでプロパティを保存して使う変数のようなものはありますか?

ElecDove

総合スコア254

CSS

CSSはXMLやHTMLで表現した色・レイアウト・フォントなどの要素を指示する仕様の1つです。

0グッド

0クリップ

投稿2015/06/15 00:04

お世話になります

CSSによるコーディングをしていて、「この色をあっちでもこっちでも使いたい」、と思うことが多々あると思います。
そんなときに例えば

lang

1$button_color = "#3498db"

という風に変数などに色を入れて、

lang

1a.button{ 2 background:$button_color; 3} 4 5#hogehoge{ 6 color:$button_color; 7}

のように指定する方法はないでしょうか

JSでやろうと思えばできないこともないかなと思っていますが、
スタイルの定義がCSSとJS両方になってしまうのは考え物だと思いますし…

何か良い方法がありましたら教えてください

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答2

0

独自のプロパティを作成して使える CSS Variables というものがあります
http://www.hcn.zaq.ne.jp/___/WEB/css-variables-ja.html#custom-property

たとえば

lang

1:root { 2--main-color: #06c; 3} 4div { 5 color: var(--main-color); 6}

という感じに使えます

が、

Firefox 以外はまだ未実装・・・
便利そうなのですが他のブラウザの実装はいつになるやら

投稿2015/06/15 00:59

takito

総合スコア3111

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

ElecDove

2016/05/05 02:10

御礼が遅くなり申し訳ありません 回答ありがとうございました まさに求めていたもの・・・ 早く標準化して欲しいものです
guest

0

ベストアンサー

都度都度CSSを生成する必要がありますが、SassやLessがまさにそれに当たりますね。

私も最近触れたばかりですが、プロパティの値を変数化できたり継承させることができたり、非常に便利です。

dotinstallの講座がわかりやすいですので触れてみると良いかと思います。

LESS入門
Sass/SCSS入門

投稿2015/06/15 00:37

ikuwow

総合スコア462

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

ElecDove

2016/05/05 02:09

回答ありがとうございます お礼が遅くなり申し訳ありません こんな便利なものがあるのですね、知りませんでした
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問