テキストリンクのホバー線は、border を指定するとそこそこ使える。

001

2016/05/24 アニメーションするアンダーラインを追加しました。

 

ボーダー

See the Pen ホバー線 / solid by keita hirai (@keitahirai) on CodePen.


 

両端からスライド

See the Pen ホバー線 / 両端からスライド by keita hirai (@keitahirai) on CodePen.


 

中央からスライド

See the Pen ホバー線 / 中央からスライド by keita hirai (@keitahirai) on CodePen.

 

問題点

リンクをブロック化すると、行全体に下線が表示される。

コメントを投稿する

※メールアドレスは私にだけ届き、サイトには表示されません。
※「送信する」ボタンは、一度だけクリックしてお待ちください。