BLOGスタッフブログ

インソースマーケティングデザイン

2020.07.08 コーディング

【CSS】地味に時間が掛かるボタンの装飾まとめ

ボタンの装飾を擬似要素で作ろうとすると意外と時間がかかります。
画像で入れると画質が気になりますし、細かな装飾もCSSで作ればサイト全体の見栄えもよくなるので出来ればCSSで作りたいですね。
そこで個人的によく使うボタンの装飾を4種類ほどまとめました。

ボタンのアイコンはFont Awesomeを使用しています。

ベーシックなボタン

別タブで開くボタン

お問い合わせボタン

PDFボタン

インソースマーケティングデザインが書いた他の記事

見積もり・ご依頼など、
お気軽にご相談ください

本サイトはユーザーエクスペリエンスの向上などを目的に、Cookieを使用しています。
右記のバナーで「同意する」をクリックする、または本サイトを利用することにより、
お客様は弊社のCookieポリシーに同意したことになります。

同意します