HTMLフォーム要素:完全リファレンス

input、textarea、select、button、fieldset、datalist、output、progress、meterを含むHTMLフォーム要素を、実践的な例とベストプラクティスでマスターします。

Forms

詳細な説明

HTMLフォーム要素

HTMLフォームは、Web上でユーザー入力を収集する主要なメカニズムです。<form>要素には、ユーザーがデータを送信またはクライアントサイドで処理するためのインタラクティブコントロールが含まれます。

必須フォーム要素

<input> — 22以上のタイプを持つ最も汎用的なフォーム要素です。テキスト、メール、パスワード、数値、日付、ファイル、チェックボックス、ラジオボタンなどに対応します。

グルーピングとラベル

常にラベルをフォームコントロールに関連付けてください。<fieldset><legend>で関連するフィールドをグループ化します。

モダンフォーム要素

  • <datalist> — 入力フィールドのオートコンプリート候補
  • <output> — 計算結果の表示
  • <progress> — タスク完了の表示
  • <meter> — 既知の範囲内のスカラー測定値の表示

ユースケース

HTMLフォーム要素の理解は、登録ページ、検索インターフェース、設定パネル、ECチェックアウト、データ入力アプリケーションを構築するすべてのWeb開発者にとって重要です。ネイティブフォーム要素を適切に使用することで、JavaScriptなしで組み込みのバリデーション、アクセシビリティ、モバイルキーボード最適化が提供されます。

試してみる — HTML Element Reference

フルツールを開く