1

Visual Studio では、たとえば CSS 値に「青」と入力すると、適切な RGB に変換されます。カスタムカラーを定義することは可能ですか? 「companyBlue」または「companyOrange」を定義できるようになりたいです。

4

2 に答える 2

2

ファイルを使用しているので、、、...などの色CSS名を使用しないでください。ブラウザがこれらの色に与える色の値を自分で決定するためです。Google Chromeと比較すると、IEでは色が完全に異なる場合があります。BlueGreenGreen

次のように、代わりに16進値を使用することをお勧めします。

#000 /* Black */
#fff /* White */
#f00 /* Red */

このフォトショップのようなカラーセレクターを使用すると、16進値を簡単に取得できます:http ://www.2createawebsite.com/build/hex-colors.html

さて、元の質問に戻りましょcompanyOrangeう。CSSのように変数をどのように使用できますか?簡単に言えば...CSSだけでは変数を使用できません。ただし、CSSファイルの先頭にある値を次のようなコメントに「保存」することができます。

/*
    COLORS
    Black:          #000    
    Company Orange: #f64;
    Company grey:   #444;
*/

代わりに本当に変数を使用したい場合は、SASS、LESS、StylusなどのCSS前処理プログラムを使用できます。これらはすべて変数を使用します。

続きを読む:

于 2013-03-15T19:36:11.853 に答える
0

私はこれを見つけましたが、ソリューションがあまり好きではありません: http://24ways.org/2006/faster-development-with-css-constants/

本当に定数を実現するには、CSS 以外のものを使用してファイルを処理してから、ブラウザーに送信する必要があります。任意のスクリプト言語 (PHP、ASP、ColdFusion など) を使用して、定数を入力した CSS ファイルを解析できます。したがって、CSS ファイルの定数セクションには次のようになります。

$darkgrey = '#333333'; 
$darkblue = '#000066';

CSS ファイルの残りの部分は通常どおりですが、定数値を使用する場合は、色を追加する代わりに定数名を使用します。

p { color: $darkgrey; } 

サーバー側のスクリプトは、CSS ファイルを解析し、定数名を定数値に置き換えて、有効な CSS ファイルをブラウザーに提供できます。Christian Heilmann は PHP に対してこれを行っていますが、これはサーバーで利用可能な任意の言語に適応させることができます。

Shaun Inman は、PHP スクリプトにリンクする必要をなくし、 at-rules の構文を使用して定数を追加できる別の方法を考え出しました。この方法でも PHP を使用しているため、.htaccess ファイルを編集する必要があります。

もう 1 つの方法は、ローカルでスクリプトを使用して静的 CSS ファイルを生成することです (定数が単に開発速度を向上させるためのものである場合)。または Web アプリケーション自体の一部として生成します。更新する値の代わりに定数名を使用してテンプレート スタイルシートを保存すると、スクリプトでテンプレートを開き、変数を置き換えて、結果を新しいスタイルシート ファイルとして保存するだけで済みます。

CSS 定数は開発者にとって非常に役立ちますが、アプリケーションに新しい機能を追加するためにも使用できます。この記事の冒頭で使用した電子メール アドレスの例と同様に、CSS とサーバー サイド スクリプトを組み合わせて使用​​すると、サイト管理者は、管理されているコンテンツのページで使用する新しいテーマの色を選択できるようになります。サイト。定数を使用すると、CSS の特定の部分を変更するオプションを与えるだけで済み、別の CSS ファイル全体をアップロードする必要がなくなります。これにより、興味深い結果が得られる可能性があります。

今年のクリスマスツリーの下に実際の CSS 定数が見つかる可能性は低いため、上記の方法はスタイルシートをより適切に管理するためのいくつかの可能性です。ただし、より良い方法、CSS 定数のホラー ストーリー、またはその他の提案がある場合は、以下にコメントを追加してください。

于 2013-03-15T19:14:45.703 に答える