HTML入門⑩
こんにちは。
初心者がWEBデザイナーを目指し、学んだことを記録していくブログです。
本日はHTMLについてふれてみようと思います!
前回の投稿はこちら↓
HTML入門①
HTML入門②
HTML入門③
HTML入門④
HTML入門⑤
HTML入門⑥
HTML入門⑦
HTML入門⑧
HTML入門⑨
めっきり寒くなってまいりました。
ついに本日から長袖を2枚着始めました。
足元もくるぶしソックスから、普通の靴下へ。
昨日の帰りに東北出身の3人で、もう冬の風だねえといいながら歩きました。
冬に敏感な東北出身。アウターも一番最初に来ている気がします。
温かくするという行動が身に染みているのだと思った今日この頃。
さて、本日も”class”要素のお話です。
昨日はクラスを実際にあててみましたが、クラス要素は同じ名前をいくつも持つことができます。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 |
グループ化する <div class="title-1"> <h3>太陽の塔</h3> <p>岡本太郎</p> </div> <div class="title-2"> <h3>ゲルニカ</h3> <p>パブロ・ピカソ</p> </div> <div class="title-1"> <h3>スラヴ叙事詩</h3> <p>アルフォンス・ミュシャ</p> </div> <div class="title-2"> <h3>バベルの塔</h3> <p>ピーテル・ブリューゲル</p> </div> |
このような形で、例えば奇数段は文字を赤にする、偶数段は文字を黄色にする。
ということが可能になります。
(これはcssで指定するんですがね。)
さて、いくつも指定ができるものがあるということは、一つしかしてできないものもあります。
それは、”id”です。
一つのhtmlで一度しか使えません!繰り返し使えません。
考え方としては、自分で置き換えてみるといいかもしれません。
【苗字】は自分以外に、家族がいますよね。佐藤さん家の人々はたくさんいます。
さて、【名前】はどうでしょうか。(ここでは同姓同名は考えずに!)
【佐藤太郎】さん、【佐藤花子】さんは、一人しかいませんよね。
自分も一人しかいません。
“class”は同じ【苗字】を持った人たちに使うことができます。
“id”は【苗字・名前】という組み合わせから、この世でたった一人のあなたにしか使えません。
(なんだか壮大な物語になった)
本当に一部分のみを変えたいときは”id”を使いましょう。
その他共通で変えたいという計画があるなら、”class”を使いましょう。