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設定
なし。