複数行テキストの入力欄を作る

<textarea name=”” rows=”” cols=”” wrap=””>

複数行テキストの入力欄は、1行テキストのように1行だけ文字を入力できるのではなく、複数行にわたって文字を入力できます。メッセージやお問い合わせの入力に適しています。

複数行はINPUTタグではなく、<textarea>タグで指定します。1つのフォーム内に複数の入力欄を設置する場合など、入力欄に名前を付けるには「name=””」という属性を追加します。

さらに、入力欄の大きさを指定するためには「rows=””」という属性と、「cols=””」という属性を追加します。前者は入力欄の行数(縦の長さ)を、後者は入力欄の横幅を半角数字でそれぞれ指定します。適切な大きさになるよう設定しましょう。

また、「wrap=””」という属性は、入力欄内に書かれたテキストを送信する際の自動改行の有無を設定します。「wrap=”soft”」は改行をせずに文字を入力していった場合、入力欄の端で見た目上、自動改行されますが、実際には改行されずに送信されます。

これを「wrap=”hard”」としたときは、見た目上も、送信内容も自動改行されます。

さらにあらかじめ入力欄に文字を表示させるには、<textarea>タグ内にその文字を記入します。

記述例

<form action=”#”>
<textarea name=”テキストエリア” rows=”3″ cols=”50″ wrap=”hard”>あらかじめ文字を表示
</textarea>
</form>


<textarea>タグは単体では動作しません。必ずフォームタグの中に挿入してください。

関連情報

【厳選】合わせて読みたいおすすめ書籍

WEB制作支援サイトのHTMLタグボードだからオススメできる厳選書籍です。私が読んでいない本はオススメしません。

HTMLやCSS、Webデザインを体系的に学ぶなら

最新のHTML5を学ぶなら

参考情報

最新情報をチェックしよう!