Summary  
This chapter explains how to configure HTML input elements using attributes to set default values, autofocus behavior, required validation, and placeholder text.  

General domain of usage  
Web form development

HTMLの`<input>`要素は、動作を変更する属性でカスタマイズ可能。以下はよく使われる主な属性。

## value
入力要素の初期値を設定。
- ボタンの場合：ボタンのテキストを定義；
- テキスト／パスワードフィールドの場合：デフォルトのテキストを設定；
- チェックボックス／ラジオボタンの場合：選択時に送信される値を設定。

`value`は`type="file"`と併用不可。

注意

PGZvcm0gb25zdWJtaXQ9InJldHVybiBmYWxzZSI+CiAgPGlucHV0IHR5cGU9ImJ1dHRvbiIgdmFsdWU9IkNsaWNrIE1lIiAvPgogIDxpbnB1dCB0eXBlPSJ0ZXh0IiB2YWx1ZT0iRGVmYXVsdCBUZXh0IiAvPgogIDxpbnB1dCB0eXBlPSJjaGVja2JveCIgdmFsdWU9Im5ld3NsZXR0ZXIiIC8+CjwvZm9ybT4=

## autofocus
ページの読み込み時に自動的に入力欄へフォーカスを設定

下記の例では、コードを実行してもページがリロードされないため、この機能は動作しません。

PGZvcm0gb25zdWJtaXQ9InJldHVybiBmYWxzZSI+CiAgPGxhYmVsIGZvcj0icXVlc3Rpb24iPllvdXIgcXVlc3Rpb248L2xhYmVsPgogIDxpbnB1dCB0eXBlPSJ0ZXh0IiBpZD0icXVlc3Rpb24iIGF1dG9mb2N1cyAvPgogIAogIDxsYWJlbCBmb3I9Im5hbWUiPllvdXIgTmFtZTwvbGFiZWw+CiAgPGlucHV0IHR5cGU9InRleHQiIGlkPSJuYW1lIiAvPgo8L2Zvcm0+

## required
入力必須属性。フィールドが入力されるまでフォームの送信ができない。

PGZvcm0gb25zdWJtaXQ9InJldHVybiBmYWxzZSI+CiAgPGxhYmVsIGZvcj0iZW1haWwiPkVtYWlsPC9sYWJlbD4KICA8aW5wdXQgdHlwZT0idGV4dCIgaWQ9ImVtYWlsIiByZXF1aXJlZCAvPgogIAogIDxsYWJlbCBmb3I9InBhc3N3b3JkIj5QYXNzd29yZDwvbGFiZWw+CiAgPGlucHV0IHR5cGU9InBhc3N3b3JkIiBpZD0icGFzc3dvcmQiIHJlcXVpcmVkIC8+CiAgCiAgPGJ1dHRvbiB0eXBlPSJzdWJtaXQiPlJlZ2lzdGVyPC9idXR0b24+CjwvZm9ybT4=

## placeholder
ユーザーが入力するまで、入力欄内に補助テキストを表示。電話番号やカード情報などのフォーマットに便利。

PGZvcm0gb25zdWJtaXQ9InJldHVybiBmYWxzZSI+CiAgPGxhYmVsIGZvcj0icGhvbmUiPlBob25lIE51bWJlcjwvbGFiZWw+CiAgPGlucHV0IHR5cGU9InRlbCIgaWQ9InBob25lIiBwbGFjZWhvbGRlcj0iKzEtKFhYWClYWFgtWFhYIiAvPgogIAogIDxsYWJlbCBmb3I9ImNhcmQiPkNhcmQgZGV0YWlsczwvbGFiZWw+CiAgPGlucHV0IHR5cGU9InRleHQiIGlkPSJjYXJkIiBwbGFjZWhvbGRlcj0iWFhYWC1YWFhYLVhYWFgtWFhYWCIgLz4KICAKICA8YnV0dG9uIHR5cGU9InN1Ym1pdCI+TWFrZSBQYXltZW50PC9idXR0b24+CjwvZm9ybT4=

各例では異なる `type` 属性を使用しており、これによって入力欄の動作が変化します。入力タイプについては次の章で解説。

ノート

input要素のデフォルト値を設定するために使用される属性はどれか。

`input`要素に期待される値のヒントや例を設定するために使用される属性はどれか。

フォーム送信前に入力フィールドが必須であることを指定するために使用される属性はどれか。

HTMLの基本を学びましょう。HTMLはすべてのウェブサイトの基盤です。タグや属性を使ってコンテンツを構造化し、明確なドキュメントレイアウトを構築し、画像、リンク、テーブルを追加します。入力やインタラクションを取得するためのアクセシブルでユーザーフレンドリーなフォームを作成します。ベストプラクティスに従いながら、構造化され機能的なウェブページの作成を実践します。HTMLを習得してウェブ開発の第一歩を踏み出しましょう。

HTMLフォームの多様性を探求します。主要な概念と技術を活用して、直感的でユーザーフレンドリーなフォームの設計方法を学びます。フォームがウェブサイト上でユーザーの操作やデータ送信を可能にする仕組みを理解します。

入力属性によるフォームの強化

value

autofocus

required

placeholder

1. input要素のデフォルト値を設定するために使用される属性はどれか。

2. `input`要素に期待される値のヒントや例を設定するために使用される属性はどれか。

3. フォーム送信前に入力フィールドが必須であることを指定するために使用される属性はどれか。