CSSでボタン(button)タグのスタイルをリセット!

CSSでボタン(button)タグのスタイルをリセット!
この記事は約1分で読めます。

HTMLを書いていてよく使うボタン要素だけど、ブラウザのスタイルがダサすぎるので一回リセットしとこ!

button{
  padding: 0;
  border: none;
  outline: none;
  appearance: none;
  background: none;
  cursor: pointer;
}

んじゃあ、ブラウザ固有のスタイルとリセットしたボタンスタイルを比較してみよう。

ブラウザのスタイル
リセットしたボタンスタイル

このリセットのいい所は、「:focus」のスタイルもリセットされる所で、邪魔なスタイルを全部取ってくれる所だね!
以上でボタンのスタイルをリセットする方法を終わります!

コメント

タイトルとURLをコピーしました