3

このページのセクション/* Common Classes */を参照してください。

http://webdesign.about.com/od/css/a/master_stylesht_2.htm

これらのcssクラスは、どのプロジェクトでも使用できますか？セマンティックの観点から？

/* Common Classes */

.clear { clear: both; }

.floatLeft { float: left; }

.floatRight { float: right; }

.textLeft { text-align: left; }

.textRight { text-align: right; }

.textCenter { text-align: center; }

.textJustify { text-align: justify; }

.blockCenter { display: block; margin-left: auto; margin-right: auto; } /* remember to set width */

.bold { font-weight: bold; }

.italic { font-style: italic; }

.underline { text-decoration: underline; }

.noindent { margin-left: 0; padding-left: 0; }

.nomargin { margin: 0; }

.nopadding { padding: 0; }

.nobullet { list-style: none; list-style-image: none; }
4

5 に答える 5

14

いいえ。良い選択ではありません。cssの全体的なポイント、特にクラスの概念については、何かが「どのように」表示されるかではなく、「何」を表すかを説明することです。何かが何を意味するか（つまり、そのセマンティクス）とそれがどのように表示されるか（つまり、その表現）は、2つの別個の概念です。たとえば、あるスタイルシートで水色に青を表示し、色盲の人向けに作成された別のスタイルシートで白に高コントラストの黒を表示することにした場合、メニューが変更されないという事実。

クラスにプレゼンテーションの意味を与える場合、ドキュメントの表示方法を変更するには、Webページのhtmlを変更する必要があり、プレゼンテーションを提供およびカプセル化するために特別に設計されたテクノロジとしてCSSを使用するという意味がなくなります。これを防ぐための代替策は、名前が妥当な情報を表していないクラス（たとえば、実際にはcolor：redディレクティブを含む「bluefont」と呼ばれるクラス）を持つことです。したがって、名前として「bluefont」を使用することは完全に任意であり、ここでは実際のコンテンツと非同期になります。ランダムな文字列「abgewdgbcv」である可能性もありますが、その場合は、表示とは関係がなく、意味を伝えるもの、つまり関連するセマンティクスを選択することをお勧めします。

そして、私たちは円を閉じます：それはクラスの要点です。W3のこのドキュメントも参照してください。

于 2010-04-11T17:34:25.557 に答える
13

いいえ、そうではありません。

できれば、クラス名は、それが何をするのかではなく、それを何に使用するのかを説明する必要があります。

たとえば、クラスに「bluebold」という名前を付けてから、テキストを赤と斜体にすることにした場合は、新しいクラスを作成して、使用するすべての場所で変更する必要があります。そうしないと、クラス名がなくなります。フィットします。

于 2010-04-11T17:29:08.203 に答える
1

私が提案したい1つのポイントは、これらを拡張するときは、クラスの名前として形容詞を使用するのではなく、動詞を使用することを確認してください。

編集：

私は、それが何をするのかではなく、それが何のために使われるのかを表すクラス名の他の点に同意します。

于 2010-04-11T17:28:08.517 に答える
-1

一般的なCSSクラスは非常に細かく、分類の問題を助長します。疑似セレクターは、問題をある程度軽減することができます。新しいウェブサイトが設計されていると仮定すると、私は次のことを行います。

*{
margin:0;
padding:0
}

li {
list-style: none; 
list-style-image: none;
}

残りはアドレス指定が難しく、floatLeftとfloatRightはレイアウトによって定義されます。

<div id="main">
<div class="searchPanel">
</div>
<div class="resultsPanel">
</div>
</div>

CSSは、理想的には（レイアウト駆動型）#main searchPanel {float：left;のようになります。} #main resultsPanel {float：right; }

あなたがアイデアを得ることを願っています。ただし、太字/下線付きのテキストで問題が発生します。下線付きのテキストは、醜いデザインを示しています。ユーザーはそのようなものをハイパーリンクと混同する傾向があります

于 2010-04-11T17:41:09.333 に答える
-3

いくつかの推奨事項：

  1. .floatLeft -> .float-left：キャメルケースはありません。

  2. .bold->.important 名前はそれを行う方法を示さずに目標を伝える必要があります

  3. .nobullet->ul.nobullet 他のcssとの競合を避けるために、最も指定することをお勧めします。

于 2010-04-11T17:34:36.397 に答える