はじめに
プログラミング学習を始めた当初、idとclassってどういう使い分けをしてるんだろうって思っていました。
同じように思っている初学者がいると思うので、簡単に説明していきます。
id属性
同じwebページ内で一度しか同じ値を使えません。
その代わり、class属性に優先してスタイルをつけることができます。
CSSに書く際は、頭に「#」を付けて記述します。
HTML
<div id="id名">hello</div>
css
# id名{
color: red;
}
・同じ値は一度しか使えないので、これはダメ！
HTML
<div id="hello">hello</div>
<div id="hello">こんにちは</div>
class属性
idと違い、同じwebページ内で何度も同じ値を使うことができます。
CSSに書く際は、頭に「.」を付けて記述します。
html
<div class="class名">hello</div>
css
.class名{
color: red;
}
・同じ値を何度でも使えるので、これはオッケー！
HTML
<div class="hello">hello</div>
<div class="hello">HELLO</div>
<div class="hello">こんにちは</div>
おわりに
基本的にはclass属性を使い、ピンポイントでスタイルを適用したいようなときがあればid属性を使えば良いでしょう。