0

マークアップでクラスのみを使用し、JavaScriptから参照する必要がある場合にのみIDを使用することが推奨されている記事を読みました(IDに関数をアタッチする方が簡単なため)

現時点では、同様のスタイルを必要とする要素が複数ある場合にのみクラスを使用します。ただし、この記事(私は読んだと思いますが、参照はありません)には、クラス全体を使用する必要があると記載されています。

私はこれを行います:

<header id="banner"></header>

推奨事項は次のとおりです。

<header class="banner"></header>

(バナーはページごとに1回だけ使用されますが)

これは新しい「グッドプラクティス」ですか?

ありがとう

4

4 に答える 4

2

私の知る限り、あなたが正しいと知っている限り、複数の要素をスタイリングする必要がある場合はクラスを使用し、一意の要素のみをスタイリングする場合はIDを使用する必要があります。

于 2012-05-08T16:37:36.043 に答える
1

オブジェクト指向のcssに関する記事に出くわしたかもしれません。基本的な考え方は、スタイルを、クラスを介してマークアップにリンクされる一種の抽象化として考える必要があるということです。私はそれが物事を整理するための良いテクニックだと思いますが、他のテクニックと同様に、それは普遍的な厳格なルールではありません。それが最も理にかなっている限り、スタイルをIDでマークアップにリンクすることに問題はありません。

定義するのが本当に難しいのは、「理にかなっている」ことです。

于 2012-05-08T16:39:33.370 に答える
1

ID属性、定義、および使用法

id属性は、HTML要素の一意のIDを指定します(値はHTMLドキュメント内で一意である必要があります)。

id属性は、スタイルシート内のスタイルを指すために最もよく使用され、JavaScript(HTML DOMを介して)によって特定のIDを持つ要素を操作するために使用されます。

詳しくはこちらをご覧ください。

CLASS属性、定義、および使用法

class属性は、要素の1つ以上のクラス名を指定します。

class属性は主に、スタイルシートのクラスを指すために使用されます。ただし、JavaScriptで(HTML DOMを介して)使用して、指定したクラスのHTML要素に変更を加えることもできます。

詳しくはこちらをご覧ください。

したがって、クラスのIDを使用してスタイルを設定できます。クラスは、Webページ全体の他の要素で再利用できることを知っているだけで、IDは常に一意である必要があります。

クラスがCSSを適用するために利用するのに最適な属性であると言う理由は、一般的なクラス名を使用してWebページ全体で多く使用できるため、コーディングにかかる​​時間を簡素化および削減できるためです:)


簡単な例:

HTML

<div id="theUniqueID">
  Hello!
</div>
<div id="theUniqueIDTwo">
  Hello Again!
</div>

CSS

#theUniqueID {
  font-size: 15px;
  text-align: right;
}
#theUniqueIDTwo {
  font-size: 15px;
  text-align: right;
}

次のように減らすことができます:

#theUniqueID, #theUniqueIDTwo {
  font-size: 15px;
  text-align: right;
}

そして、次のようにドキュメント全体で一般的に利用できます。

.format_01 {
  font-size: 15px;
  text-align: right;
}

次に、次のようなHTMLを使用します。

<div class="format_01">
  Hello!
</div>
<div class="format_01">
  Hello Again!
</div>
<div class="format_01">
  Hello Again and Again!
</div>

追伸: やり過ぎの答えで申し訳ありませんが、これにより知識の少ない人も学ぶことができます。

于 2012-05-08T16:53:51.323 に答える
0

基本的に、一意の要素にはidを使用する必要があります。つまり、ページに2回表示されない要素をページに保持する場合は、idを使用して、同じスタイルで要素のグループのスタイルを設定するか、一部の要素を保持する必要があります。同じグループで、クラスを使用する必要があります。

ただし、単一の要素にクラスを使用することもできますが、ページ上の複数の要素にIDを使用することはできません。

たとえば、getElementByIdまたはは$('#idOfElement') (using jQuery)単一の要素を返しますがgetElementsByClassName$('.idOfElement') (using jQuery)またはは一致した要素の配列を返します。したがって、同じIDを使用するページに複数の要素がある場合は、IDを持つ最初の要素のみを取得するため、複数の要素にidを使用しないでください。

于 2012-05-08T16:47:12.713 に答える