演習課題「クラスセレクタを試してみよう」
現在、クラスセレクタを使っていくつかのクラスにCSSのルールを適用しようとしています。
それぞれspan要素のclass属性値として指定してある、student、teacher、pcそれぞれ指定した要素ごとに文字色を変化させてください。
その際、studentには#f5a1b3を、teacherには#e5c67aを、pcには#527db1を指定してください。
採点の前にはファイルを保存してください。
採点して、ジャッジに正解すれば演習課題クリアです!
※コードの2行目以降に@charset "UTF-8";が記述されていると、左側に×と表示されることがあります。これは本来@charset "UTF-8";を1行目に記述すべきだと知らせているものです。採点には問題ありませんが、ブラウザによってはCSSが正しく表示されないことがあるため1行目に記述するとよいでしょう。
※有料会員になるとこの動画をご利用いただけます
詳しい説明を読む
#03:クラスセレクタ
このチャプターでは、クラスセレクタについて学習します。
クラスセレクタは特定のクラス名を持つ要素を対象にするセレクタで、指定するにはクラス名の先頭に.をつけて記述します。
MDN web docs
https://developer.mozilla.org/ja/docs/Web/CSS/Class_selectors
@charset "UTF-8";
.fruit {color: red;}
.vegetable {color: blue;}