このページの最初の例と同様に、ホバー時に <a> ラベル要素を下線でアニメーション化しようとしています。チュートリアルはあるのに、私がやっていることがうまくいかず、その理由がわからないので、この質問をするのはほとんど愚かに思えます。
<a>
これは私の CSS コンテンツです
いくつかのプロパティが欠落していることに気づきました:
コンテンツ: a::after の ''
a::after
content
""
は
を使用するため、
position:relative
a
background-color:inherit
hotpink
cursor:pointer
![[Web フロントエンド] Node.js クイック スタート](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
いくつかのプロパティが欠落していることに気づきました:
-
疑似要素 - a::after
-
-
＃＃＃お役に立てれば！コンテンツ:が欠落しています。疑似要素の場合、a::afterの ''content属性は空の""であってもかまいませんが、必ず指定する必要があります。はposition:relativeを使用するため、position:relativeはaにある必要があります。a::afterはbackground-color:inheritを使用していますが、継承できる値がないようです。現在はhotpinkという値を与えていますが、これは任意の色にカスタマイズできます。aにcursor:pointerを追加したので、希望の結果とより一致します。
例: (以下のボタンのあるライブデモを参照してください)