テキストリンクのアレンジまとめ

記事の本文中やサイトマップなどに入れることが多いテキストリンク。
CSSだけでできる動きやアイコンをつけたものをまとめてみました！

見た目のアレンジ

IEに対応しない場合、text-decorationプロパティを使用して下線をアレンジすることができます。
text-underline-offsetプロパティでテキストとの余白、text-decoration-styleプロパティで線の種類を指定することが可能です。

見た目にアレンジを加えるだけでなく、動きのアレンジも取り入れることでどのリンクを選択しているかがわかりやすくなります！

text-decolationではなく、beforeを使うことでホバーで下線を動かすことができます。

シンプルなリストのアイデアまとめ

coming soon

株式会社スピカデザイン

渋谷のWEB制作会社「スピカデザイン」の現役コーダー達が、WEB制作のヒントになるような情報をお届けします。

質問・感想などはこちら！

REQUEST

ご意見、感想や記事のリクエストなど
メッセージお待ちしております！