演習課題「::before擬似要素を試してみよう」
現在、::before擬似要素を使ってCSSのルールを適用しようとしています。p要素の先頭に*が表示されるよう変更してください。
採点の前にはファイルを保存してください。
採点して、ジャッジに正解すれば演習課題クリアです！
※コードの2行目以降に@charset "UTF-8";が記述されていると、左側に×と表示されることがあります。これは本来@charset "UTF-8";を1行目に記述すべきだと知らせているものです。採点には問題ありませんが、ブラウザによってはCSSが正しく表示されないことがあるため1行目に記述するとよいでしょう。
※有料会員になるとこの動画をご利用いただけます
詳しい説明を読む
＃08:::before/::after疑似要素
このチャプターでは、::before/::after疑似要素について学習します。
::before/::after擬似要素は、利用すると適用先コンテンツの前または後に、要素が構成したボックスの影響を受けないボックスを挿入することができる要素です。
挿入するボックスの中身はcontentプロパティで指定でき、文字や画像などを指定する事ができます。
MDN web docs
https://developer.mozilla.org/ja/docs/Web/CSS/::before
https://developer.mozilla.org/ja/docs/Web/CSS/::after
@charset "UTF-8";
p::before {content: "・";}