エントリーの編集
エントリーの編集は全ユーザーに共通の機能です。
必ずガイドラインを一読の上ご利用ください。
リンク要素のhover時に下線をCSSでアニメーション表示させる方法
記事へのコメント0件
- 注目コメント
- 新着コメント
このエントリーにコメントしてみましょう。
注目コメント算出アルゴリズムの一部にLINEヤフー株式会社の「建設的コメント順位付けモデルAPI」を使用しています
- バナー広告なし
- ミュート機能あり
- ダークモード搭載
関連記事
リンク要素のhover時に下線をCSSでアニメーション表示させる方法
線を引くようなアニメーション よくグローバルメニューなどにマウスオーバーするとその要素に下線がアニ... 線を引くようなアニメーション よくグローバルメニューなどにマウスオーバーするとその要素に下線がアニメーション表示されるのを見かけます。ちょっとしたアニメーションがあるだけで、気持ちおしゃれに見えるから不思議。ということで、HTMLとCSSでの下線アニメーションをまとめておきます。 HTMLの以下のコードを使用して、CSSの設定を行います。 <ul> <li><a href="">MENU01</a></li> <li><a href="">MENU02</a></li> <li><a href="">MENU03</a></li> <li><a href="">MENU04</a></li> <li><a href="">MENU05</a></li> </ul>下線が左から右に引かれるアニメーション 左から右へのアニメーションは以下のように設定します。 ul { display: fle