【はてなブログ】読者になるボタンのデザインカスタマイズ4つ part2

スポンサードリンク

※ブラウザはFirefox,Chrome,IE11で検証済みです。レスポンシブデザイン対応です。

part1は下記記事です。
読者になるボタンの表示設定や、CODEPENの見方は下記記事にあります。

www.funclur.com

好評っぽいのでpart2作ってみました!

4つまとめ

See the Pen GvXBJy by funclur (@funclur) on CodePen.

今回は1つずつ分けまして、各々変更する箇所はコメント書いてますので、お好みのカラーなり幅なりを入れてみてください。

ブルブルして止まる

See the Pen MvqBwM by funclur (@funclur) on CodePen.


アンダーラインが広がる

See the Pen YxOjyQ by funclur (@funclur) on CodePen.


浮いて影ができる

See the Pen qXMyba by funclur (@funclur) on CodePen.


右に背景色が伸びてバウンスする

See the Pen GvXBoy by funclur (@funclur) on CodePen.


まとめ

以上、読者になるボタンのデザインカスタマイズ4つpart2でした。

また、必ず作業前にバックアップを取りましょう!

www.funclur.com

www.funclur.com

www.funclur.com