0

Good day guys! I'm a newbie here and I'm just wondering how to use div id and div class. Let's say for example, I want to have many div boxes in my site with all the same styles in each box. Is this the right thing to do? Please enlighten me.

HTML:

<div id="body">
    <div id="box1" class="style"></div>
    <div id="box2" class="style"></div>
    <div id="box3" class="style"></div>
    //(and so on)//
</div>

CSS:

.style {
    //(put elements here)//
}
4

7 に答える 7

2

すべてが状況や状況に依存するため、実際に行うべき正しいことはありません。

なぜこれが「間違った」ことだと思いますか？これはあなたが書かなければならないコードの量を減らすので、それは好ましいですよね？

のスタイルを<div>個別にオーバーライドする必要があるIDを使用することもできます。

.style {
    color: red;
}
#body1 {
    color: blue;
}

要素、ID、クラスにはそれぞれ異なるセレクターの優先順位があるため、他の見込み客がどれほど魅力的に見えても、クラスと疑似クラス以外のものは使用しないことをお勧めします。あなたがそれについて訓練されているなら、あなたのCSSは後で更新するのがより簡単になるでしょう。上記の例はbody1、の代わりにクラスの場合でもまったく同じようにID機能します（ただし、IDを使用してDOM操作の一意の要素を識別することをお勧めします）。

また、要素のクラス名を選択してHTMLで使用する場合は、W3Cのアドバイスに従います。

...作成者は、コンテンツの目的の表示を説明する値ではなく、コンテンツの性質を説明する値を使用することをお勧めします。

于 2013-02-26T06:26:11.153 に答える
1

ID は一意です。

- 各要素は 1 つの ID のみを持つことができます

-各ページには、その ID を持つ要素を 1 つだけ含めることができます

クラスは一意ではありません:

- 複数の要素で同じクラスを使用できます。

-同じ要素で複数のクラスを使用できます。

于 2013-02-26T06:23:29.520 に答える
0

これを使用できます

<div id="demo">
    <div  class="box test"></div>
    <div  class="box test"></div>
    <div  class="box test"></div>

</div>

CSS:

#demo
 {
 margin:0;
 padding:0;
 }
 .box
 {
 Width:100px;
 height:50px;
 background:red;

 }
 .test
 {
 color:white;
 }

あなたは2つのクラスを適用することができます。

于 2013-02-26T06:29:32.857 に答える
0

はい、それはうまくいきます。ただし、3 つすべてに同じスタイルを適用するだけであれば、ID は必要ありません。

http://www.w3schools.com/tags/att_global_id.asp

http://www.w3schools.com/tags/att_global_class.asp

于 2013-02-26T06:22:19.847 に答える
0

はい、同じスタイルをすべての div に適用したい場合は、class を使用して div にスタイリングを確実に適用できます。div が他のものと異なる場合は、おそらく id を使用できます。これにより、javascript を介してその div にアクセスすることもできます。

于 2013-02-26T06:22:51.200 に答える
0

スタイリングのみの場合、id は実際には必要ありません。すべての子 div で同じクラスであれば、クラス名を指定する必要はありません。

HTML

<div id="body">
    <div></div>
    <div></div>
    <div></div>
</div>

CSS

#body div {
    background:red;
    width:100px;
    height:100px;
    display:inline-block
}

デモ

于 2013-02-26T06:23:36.273 に答える
0

"class" は多くの div で使用できますが、"id" は 1 つの場所でしか使用できません。ID は各ページで一意である必要があるためです。

<div id="body">
    <div class="mystyle"></div>
    <div class="mystyle"></div>
    <div class="mystyle"></div>
    //(and so on)//
</div>

<style>
.mystyle{color:#000;}
<style>
于 2013-02-26T06:24:02.443 に答える