![見出し画像](https://assets.st-note.com/production/uploads/images/40016007/rectangle_large_type_2_770439304b9e25a7c625fe27cdeb495b.png?width=800)
【HTML+CSS】グラフィカルなボタンデザイン
HTMLとCSSで作業される方向けです。
ちょっとしたCSSのテクニックです。
サンプルのhtml をアップしているので、ブラウザで開いてみていただければ。
https://revenue-test.biz/test_html/button.html
(上記URLをブラウザでご確認ください。)
![画像1](https://assets.st-note.com/production/uploads/images/39586525/picture_pc_800b882d00bba197250ac3d2c00fbc85.png?width=800)
内容は、画像を一切使わなくても、このくらいのグラフィカルなボタンがデザインできますよー、という内容です。
(画像を使用しないので、画像ボタンやバナーよりは読み込みが速いと思われます。)
サンプルでは、<button>タグと<a>タグの2パターン用意しております。
使うことはめったにないとは思いますが…
覚えておいて損はないと思います。
色々と応用も効くと思いますので。
この記事が気に入ったらサポートをしてみませんか?