4つのcheckbox

4つのcheckbox
  1. 概要
  2. デザイン
  3. 参考資料

概要

この記事はcheckboxの記事です

デザイン

checkboxを4つデザインしてみました

（※サイトの仕様により、プレビューに反映されません（この記事の作成時点）
そのため、
下書きを録画して、お届けします
何卒、ご容赦ください）
※音は出ません

デザインのコード

参考資料

参考

所感

  • labelにはheightやwidthを指定出来ないので、display: inline-blockが必要
  • box-sizing: border-boxがある場合、heightやwidthが不要な場合がある
    （例えば、borderが四辺に在るなど）
  • チェックボックスとラベルは、複数必要な場合がある（個別に異なる反応が欲しい場合）
  • 反応させたいlabelは、inputの後にあると良い
  • 6
  • 0
  • 2

おすすめのタグ

シークワーサー

　シークワーサーと申します。 ライティングやデザインに興味があります。 この度は何卒よろしくお願い致します。

作者のページを見る

寄付について

「novalue」は、‟一人ひとりが自分らしく働ける社会”の実現を目指す、
就労継続支援B型事業所manabyCREATORSが運営するWebメディアです。

当メディアの運営は、活動に賛同してくださる寄付者様の協賛によって成り立っており、
広告記事の掲載先をお探しの企業様や寄付者様を随時、募集しております。

寄付についてのご案内