<input type=”checkbox”>|チェックボックスを作成する

<input type="checkbox">|チェックボックスを作成する

<input>タグのtype属性に「checkbox」を指定すると、複数の選択肢から1つを選択するためのチェックボックスを作成できます。
 
 

使用例

 
 

表示例

どのようなショップをよ利用しますか?






 
 

スポンサーリンク

name属性

コントロールの名前を指定します。
コントロールの名前が同じチェックボックスは同一のグループとして認識されるため、共通の項目に対する選択肢を作成する場合は、以下のようにname属性の値を同じにしましょう。

 
 

value属性

name属性の値とともに、サーバーへ送られる値を指定します。

 
 

スポンサーリンク

checked属性

checked属性を指定すると、そのチェックボックスがあらかじめ選択された状態で表示されるようになります。
こちらは、以下のいずれかの形式で指定します。

  • checked
  • checked=”checked”
  • checked=””

 

 
 

required属性

そのコントロールへの入力が必須であることを指定します。
こちらは、以下のいずれかの形式で指定します。

  • required
  • required=”required”
  • required=””

 
 
required属性がある場合、コントロールにデータが入力されない限り、送信できないようになります。
 
 

スポンサーリンク

autofocus属性

ページが表示されたら、そのコントロールへ自動的にフォーカスが当たるよう指定します。
autofocus属性は、1つの文書に1つだけ指定することができます。
こちらは、以下のいずれかの形式で指定します。

  • autofocus
  • autofocus=”autofocus”
  • autofocus=””

 
 

disabled属性

そのコントロールを無効にします。
disabled属性を指定すると、入力や選択、クリックなどができなくなり、データも送信されなくなります。
こちらは、以下のいずれかの形式で指定します。

  • disabled
  • disabled=”disabled”
  • disabled=””

 
 

スポンサーリンク

form属性

コントロールを指定のform要素と結び付けます。
結びつけたいform要素のid属性の値をこの属性の値に指定することで、コントロールがform要素の中になくても、そのフォームの部品として機能するようになります。

 
 
HTML5 タグ図鑑

HTML5タグ全種類を図鑑としてまとめています。タグの意味や使い方でわからないことがあれば、ぜひこのページをご活用ください。

HTML5 タグ図鑑へ

 
HTML5 タグ図鑑

スポンサーリンク








<input type="checkbox">|チェックボックスを作成する