HTML <textarea>タグ


複数行のテキスト入力コントロール(テキスト領域):

<label for="w3review">Review of W3Schools:</label>

<textarea id="w3review" name="w3review" rows="4" cols="50">
At w3schools.com you will learn how to make a website. They offer free tutorials in all web development technologies.
</textarea>

以下の「自分で試してみてください」の例をもっと見てください。


定義と使用法

<textarea>タグは、複数行のテキスト入力コントロールを定義します

この<textarea>要素は、コメントやレビューなどのユーザー入力を収集するために、フォームでよく使用されます。

テキスト領域は無制限の数の文字を保持でき、テキストは固定幅フォント(通常はCourier)でレンダリングされます。

テキスト領域のサイズは、<cols>and<rows>属性(またはCSS)で指定されます。

nameフォームの送信後にフォームデータを参照するには、この属性が必要です( name属性を省略すると、テキスト領域のデータは送信されません)。

このid属性は、テキスト領域をラベルに関連付けるために必要です。 

ヒント:アクセシビリティのベストプラクティスとして、常に<label>タグを追加してください。


ブラウザのサポート

Element
<textarea> Yes Yes Yes Yes Yes


属性

Attribute Value Description
autofocus autofocus Specifies that a text area should automatically get focus when the page loads
cols number Specifies the visible width of a text area
dirname textareaname.dir Specifies that the text direction of the textarea will be submitted
disabled disabled Specifies that a text area should be disabled
form form_id Specifies which form the text area belongs to
maxlength number Specifies the maximum number of characters allowed in the text area
name text Specifies a name for a text area
placeholder text Specifies a short hint that describes the expected value of a text area
readonly readonly Specifies that a text area should be read-only
required required Specifies that a text area is required/must be filled out
rows number Specifies the visible number of lines in a text area
wrap hard
soft
Specifies how the text in a text area is to be wrapped when submitted in a form

グローバル属性

この<textarea>タグは、HTMLのグローバル属性もサポートしています。


イベント属性

この<textarea>タグは、HTMLのイベント属性もサポートしています。


その他の例

デフォルトのサイズ変更オプションを無効にします。

<html>
<head>
<style>
textarea {
  resize: none;
}
</style>
</head>
<body>

<label for="w3review">Review of W3Schools:</label>

<textarea id="w3review" name="w3review" rows="4" cols="50">
At w3schools.com you will learn how to make a website. They offer free tutorials in all web development technologies.
</textarea>

</body>
</html>

関連ページ

HTML DOMリファレンス:Textareaオブジェクト

CSSチュートリアル:フォームのスタイリング


デフォルトのCSS設定

なし。