昨日、職場の先輩に遅くまで一緒に残っていただき
自分が組んだコードの確認をしていただきました
本当初心者すぎて先輩には申し訳ないのですが
自分は最初、とにかくHTMLのタグにclassを付けまくっていました…。
そしてCSSでdivとimgタグそれぞれに装飾をする、みたいな。
例えば、
【HTML】
<div class="rei">
<img class="image-rei" src="〜">
</div>
↓
【CSS】
.rei {
width:100px;
}
.image-rei{
max-width:100%;
}
といった感じに。
しかし、親要素に対して、子要素のタグが一つしかない場合は
【HTML】
<div class="rei">
<img src="〜">
</div>
↓
【CSS】
.rei div{
width:100px;
}
.rei img{
max-width:100%;
}
という風に共通のclass名を使って書いた方がいい、とのことです。
１つ目の記述でも間違いではないんだけど
理由としては共通のタグを使うことで
classの名前を節約し、また内容を整理しやすくなると教えていただきました。
コーディングを普段やってる方からしたら当たり前なことなんだけど、
初心者の自分からしたら目から鱗って感じでした
こんな自分にブチギレることもなく
丁寧に教えてくれる先輩には本当に感謝しかない。。。
早く一人前になって先輩の助けになるようになりたい