Archives : August 2019

- 2 Articles -

CSSで複数行に対応したアニメーション付きアンダーライン(下線)を実装する方法

Read Article

CSSで複数行に対応したアニメーション付きアンダーライン(下線)を実装する方法

ホバー時に左から右へ下線が伸びるアニメーションを実装したい場合、以前このブログでも紹介したことがある擬似要素を用いた実装方法では、例えば文章内にあるリンクなどで複数行にまたがるときに意図した見栄えになりません。1行・複数行関係なく使えるアニメーション付きアンダーライン(下線)を実装したい場合は、以下のように`linear-gradient()`と`background-size`を組み合わせること…

  • Tips

Close the search window,
please press close button or esc key.