label,
textarea {
  font-size: 0.8rem;
  letter-spacing: 1px;
}

textarea {
  padding: 10px;
  max-width: 100%;
  line-height: 1.5;
  border-radius: 5px;
  border: 1px solid #ccc;
  box-shadow: 1px 1px 1px #999;
}

label {
  display: block;
  margin-bottom: 10px;
}

上記の例では

css
textarea {
  max-height: 130px;
  max-width: 500px;
}

結果

"minlength" と "maxlength" を使用した例

この例は文字数の最小値と最大値を、それぞれ 10 と 20 に設定しています。見てみましょう。

html

css
textarea {
  max-height: 130px;
  max-width: 500px;
}

結果

なお、minlength は最小値を超えて入力された文字をユーザーが削除することを阻止しませんので、入力された値により

css
textarea {
  max-height: 130px;
  max-width: 500px;
}

結果

メモ: プレースホルダーはフォームに入力されるべきデータの種類の例を示すためだけに使用してください。入力欄に関連付けられた 要素の代わりとして使用しないでください。全体的な説明は、ラベルとプレースホルダーを参照してください。

無効と読み取り専用

この例では 2 つの

css
textarea {
  display: block;
  resize: horizontal;
  max-width: 500px;
}

結果

技術的概要

コンテンツカテゴリー フローコンテンツ, 記述コンテンツ, 対話型コンテンツ, リスト化, ラベル付け可能, リセット可能, 送信可能 フォーム関連 要素
許可されている内容 テキストのみ
タグの省略 不可。開始および終了タグの両方が必要。
許可されている親要素 記述コンテンツを受け入れるすべての要素
暗黙の ARIA ロール textbox
許可されている ARIA ロール 許可されている role なし
DOM インターフェイス HTMLTextAreaElement

仕様書

Specification
HTML
# the-textarea-element

ブラウザーの互換性

関連情報