【HTML】ラジオボタンの色とサイズを変更しよう!【CSS】

HTML-CSS

みなさんこんにちは、現役エンジニアのサメハックです

未経験からWebエンジニアに転職し、
正社員として5年働いたのちフリーランスとして独立しました。

1分で理解できるHTML/CSS講座シリーズです。

今回はラジオボタンの色とサイズを変更する方法について学んでいきましょう!

駆け出しエンジニアや未経験の方、
また新入社員を指導する先輩社員にとっても
わかりやすいように解説していきます!

この記事を読むと・・・
  • 1分でラジオボタンの色とサイズが変更できる
1分で理解できるHTML/CSS講座シリーズはじめっ!

ラジオボタンの色とサイズを変更しよう

ラジオボタンの色を変える構文

accent-color: 色;
枠線の色は変更できないよ!

ラジオボタンのサイズを変える構文

inline-size: フォントサイズ;
block-size: フォントサイズ;
セットで定義しよう!

実際に動かしてみよう!

See the Pen
チェックボックスの色とサイズを変える
by samehack (@samehack)
on CodePen.

実際に色とサイズの変更ができたよ!

まとめ

  • 色の変更:accent-color
  • サイズの変更:inline-size
  • サイズの変更:block-size

満足いただけたら、1クリックなのでSNSフォローしてもらえると嬉しいです🦈

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