: INPUT 要素

最終更新:2026-09-12

<input>INPUT 要素

<input> 要素は最も一般的なフォーム部品で、さまざまな入力欄を作成します。type 属性でテキスト・パスワード・チェックボックス・ラジオ・日付選択などを切り替えます。空要素です。

カテゴリフォーム
コンテンツモデルなし(空要素)
許可される親要素フレージングコンテンツを受け入れる要素(通常は <form> 内)
閉じタグ自己完結 — 閉じタグ不要
ステータス標準

📝 構文

<input type="text" name="フィールド名" placeholder="ヒントテキスト">

⚙️ 属性

この要素はグローバル属性に加え、以下の属性をサポートします:

属性説明
typeKeywordThe type of the input, determines the control's form.
  • text — Single-line text field (default).
  • password — Password field, input masked.
  • checkbox — Checkbox, multiple selection.
  • radio — Radio button, one per group.
  • email — Email field with format validation.
  • number — Number field with stepper.
  • date — Date picker.
  • file — File picker.
  • submit — Submit button.
  • button — Plain button.
  • hidden — Hidden field, submitted with the form.
nameTextThe field name submitted with the form; groups radio buttons.
valueTextThe current or default value.
placeholderTextHint text shown when the field is empty.
requiredBooleanMarks the field as required.
disabledBooleanDisables the field; not submitted.
readonlyBooleanRead-only; visible but not editable.
maxlengthNumberMaximum number of characters.
checkedBooleanDefault checked state for checkbox/radio.

▶ サンプル

下のコードを編集して、playground でリアルタイム結果を確認:

🌐 ブラウザサポート

ブラウザ ChromeChrome EdgeEdge FirefoxFirefox SafariSafari OperaOpera
<input> v1 v12 v1 v1 v1
すべての主要ブラウザでサポート
ヒント: 必ず name 属性を設定しましょう。設定しないとフィールドの値が送信されません。

📚 関連チュートリアル

Web-Tutorial.com

Web-Tutorial 技術チーム

複数の開発者によって共同維持されているプログラミングチュートリアルプラットフォーム。各チュートリアルは専門分野の開発者が執筆・レビューしています。正確で信頼性の高いコンテンツを目指しています — 問題を見つけた場合はお知らせください。

100%