1

私はCSSで学んでいますが、CSSファイルでいつ使用するか.（ドット）といつ使用するかが本当に混乱しています。#時々私は本当にどれを使うべきか疑問に思いました。

4

4 に答える 4

8

＃あなたは.Human

人間はたくさんいますが、あなたはたった一人です。その.ため、ドキュメントに何度も表示される可能性のあるクラス用です。#ドキュメントに固有のID用です。

<div class="firstname" id="personA">
    <p class="lastname">Sampson</p>
</div>

<div class="firstname" id="personB">
    <p class="lastname">Sampson</p>
</div>

div、personAとの両方の一意の識別子に注意してくださいpersonB。ただし、両方の要素には、、、などの共通のクラスが.firstnameあり.lastnameます。

専門的な例

Modernizrのようなツールを見ると、これらが実際にどのように使用されているかを確認できます。<html>この機能検出ツールは、デバイスまたはブラウザーの機能について通知するクラスを要素に追加することで、ユーザーを支援します。

<html lang="en" dir="ltr" 
      id="modernizrcom" 
      class="js no-touch postmessage history multiplebgs boxshadow...">

ここに、<html>要素の1つの一意の値が表示され#modernizrcomます。続いて、要素に関するより一般的な情報を提供する一連のクラス。これは、要素が1つのIDのみを持ち、多くのクラスを持つことができる方法の明確な例です。

それらのIDに注意してください！

これらの値は完全に一意であるため、場合によっては自分自身を隅に追いやることがあります。セレクターでIDを使用する際の潜在的な問題について詳しく知るには、セレクターでIDを許可しないを読む価値があります。

于 2012-05-30T06:25:08.963 に答える
3

＃は要素のIDと。に使用されます。要素のクラスに使用されます。HTMLドキュメントでは、IDは一意ですが（そのIDを持つ要素は1つだけである必要があります）、クラスは複数回発生する可能性があります。

<div id="content" class="shade light">
</div>

これで、次のことができます。

#content { border: solid 1px black; }

その特定のdiv要素にスタイルを追加します。ただし、次のこともできます。

.light { background-color: #eeeeee; }

違いは、後者はその背景色をそのクラスのすべての要素に適用することです（つまり、light最初のCSSステートメントはidの要素にのみスタイルを追加するのに対し、クラスのすべての要素content）。

于 2012-05-30T06:25:28.977 に答える
0

ドット（。）はクラスを表し、ハッシュ（＃）はIDを表します。

それだけではありませんが、要点は次のとおりです。

ID（#myID）は、そのセレクターを1回だけ使用する場合に使用する必要があります

クラス（.myClass）を使用して、再利用可能なスタイリングコードを作成する必要があります（たとえば、テキストを青にするため）。

于 2012-05-30T06:27:27.897 に答える
0

。クラスを表す

＃はIDを表します（ただし、ページ内で1回だけ使用されます）

常にIDがレースで最優先されます。

元：

スタイルで

.alignmeleft{float:left;}
#alignmeright{float:right;}

HTMLで：

<div class="alignmeleft" id="alignmeright">
<!--div content-->
</div>

出力

DIVはRIGHSIDEと連携します

于 2012-05-30T06:30:02.610 に答える