「id」と「class」

「id」と「class」

「id名」や「class名」を指定して、スタイルを定義することができます。 スタイルを適用させたいHTMLタグ内の「id属性」や「class属性」で指定し、その要素に適用することができます。

CSS(スタイルシート)記述の際、「id」の場合は「#id名」、「class」の場合は「.class名」というふうになります。 スタイルには半角英数字の好きな名前を付けることができます。 「#id名」「.class名」の直前に「h1」「p」などの要素名を記述することにより、 スタイルを適用させたい要素を指定することもできます。

CSSソース
#idsample{
           background-color: #ff1493;
           margin: 10px;
}
.classsample{
              font-size: 13px;
              color: #33ccff;
}
HTMLソース
<p id="idsample">
いろはにほへとちりぬるを
わかよたれそつねならむ
うゐのおくやまけふこえて
あさきゆめみしゑひもせず

</p>

<p class="classsample">
いろはにほへとちりぬるを
わかよたれそつねならむ
うゐのおくやまけふこえて
あさきゆめみしゑひもせず

</p>

<p id="idsample" class="classsample">
いろはにほへとちりぬるを
わかよたれそつねならむ
うゐのおくやまけふこえて
あさきゆめみしゑひもせず

</p>