2

<h>この基本 HTML/CSS テンプレートを使用して、タグや背景色などにさまざまな色や画像のバリエーションを使用する多くの子 Web サイトを作成します。

基本テーマを変更して、色のバリエーションを持つ子テンプレートを作成するために、1行のコードを変更できるようにする方法を探しています(.this-smart-class{color: #mycolorcodehere)その色の変更を使用するすべての要素のようなもの)。

私はすでにこれを自分で行う方法を調理していますが、私はフロントエンド開発の初心者/中級者であり、これを行うためのさまざまなアプローチに興味があります. 私はこれに CSS のみを使用することを検討していますが、おそらくいくつかの jQuery を使用することを検討していますが、それが非常に実用的であることが証明されている場合に限ります。

質問をよりよく理解するには、スクリーンショットを見てください: 同じレイアウトのバリエーション.

この質問が「具体的でない」と思われる場合は、投票するか閉じる前に私に尋ねてください。複数の質問に分けますが、これから良い答えが得られると思います。適切な用語を使用して具体的にすることはできません経験が浅いので欲しいです。

ここに画像の説明を入力

4

2 に答える 2

2

CSSプリプロセッサを使用するのがおそらく最善でしょう(私はLESSを好みます)。たとえば、「color-config-red.less」や「color-config-violet.less」などのさまざまな色構成ファイルを作成して、さまざまな色を変数で定義@background-colorし、プロジェクト全体で再利用できます。この設定を使用すると、同じレイアウトを維持しながら、さまざまな Web サイトにさまざまな色構成を簡単に含めることができます。

于 2013-07-10T11:15:01.417 に答える
1

私は、任意の数の要素に適用できる多数のジェネリック クラスを使用する傾向があります。

例えば:

.smalltext { font-size: 0.8em }
.bold { font-weight: bold }
.clear { clear: both }
.highlight { background-color: #999999 }

私はこれを前に述べました、そして何人かの人々はそれに対して批判的でしたが、それは私にとってはうまくいきます.

それから私は言うことができます:

<div id="footer" class="smalltext"></div>
<div id="box-header" class="highlight bold"></div>
于 2013-07-10T11:33:09.507 に答える