Q&A
前提・実現したいこと
初めて質問させていただきます。
現在CSSをYouTubeの動画で勉強しているものです。
divタグに疑似要素のafterをつけて文字を表示したいのですが、うまくいきません。
原因がわかる方いらっしゃいましたら教えていただけると幸いです。
発生している問題・エラーメッセージ
疑似要素が反映されない。
該当のソースコード
CSS
1body{ 2 font-size: 1.2em; 3 font-family: sans-serif; 4 width: 80%; 5 margin: 0 auto; 6} 7 8div{ 9 height: 25em; 10 margin-top: 2em; 11 position: relative; 12} 13 14div::after { 15 content: "DIVの後ろの文字ですよ！" 16 font-size: 2em; 17 position: absolute; 18 top: 42%; 19 left: 25%; 20 z-index: -1; 21} 22 23/* 色の指定 */ 24div{ 25 background-color: rgba(255,255,127,.2); 26} 27 28
HTML
1<!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <title>色の指定方法についての練習</title> 6 <link rel="stylesheet" type="text/css" href="3-3.css"> 7 </head> 8 <body> 9 <h1>Color Values</h1> 10 <div></div> 11 </body> 12 </html>
試したこと
インターネットで出てきた疑似要素のafterが反映されないときの問題点は一通り試したつもりです。
タグやセレクタは基本文字の色が変わるのですが、::afterは文字が白のままなので、疑似要素として認識されていないのではないのではと考えています。(専門用語等まだわからないことが多く視覚的な説明になってしまい申し訳ありません。)
補足情報（FW/ツールのバージョンなど）
ここにより詳細な情報を記載してください。
回答1件
0
ベストアンサー
CSS
1 content: "DIVの後ろの文字ですよ！"
セミコロン;がありません。
投稿2021/12/12 07:40
総合スコア8402
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2021/12/12 08:09