1行のテキスト入力欄を設置する

input type="text"

< input インプット type タイプ =" text テキスト ">

type属性にtextが指定されたinput要素は、1行のテキスト入力欄となります。

なお、input要素でtype属性が省略された場合や、type属性値が省略された場合、ブラウザーが指定したtype属性値に対応していない場合も、この値が指定されたものとして扱われます。

使用できる属性

input要素で解説した以下の属性を同時に使用できます。value属性に指定した値は、最初から入力された状態で表示されます。

autocomplete オート・コンプリート , autofocus オート・フォーカス , dirname ディクショナリティ・ネーム , disabled ディスエーブルド , form フォーム , list リスト , maxlength マックス・レンス , name ネーム , pattern パターン , placeholder プレースホルダー , readonly リード・オンリー , required レクワイアド , size サイズ , value バリュー

サンプルコード

以下の例では1行のテキスト入力欄を設置しています。size属性で入力欄のサイズ(文字数)を、placeholder属性でダミーテキスト(プレースホルダー)を指定しています。

<form action="cgi-bin/example.cgi" method="post">
  <p>一言のご意見やご感想をお聞かせください。</p>
  <input type="text" name="opinion" size="50" placeholder="ご意見・ご感想を入力">
  <input type="submit" name="submit" value="送信">
</form>

関連記事