<textarea cols="" rows=""></textarea>
- ブラウザ
- 分類
- インライン要素
- 要素
- textarea要素
textarea要素で、複数行のテキスト入力欄を作成することができます。
<textarea name="example" cols="50" rows="10"></textarea>
| 属性 | 値 | 説明 |
|---|---|---|
| name="" | 文字列 | 部品の名前を指定 |
| cols="" | 文字数 | 入力欄の幅を文字数で指定 |
| rows="" | 行数 | 入力欄の高さを行数で指定 |
textarea要素には、cols属性とrows属性が必須となります。
■name="" （部品の名前を指定）
フォーム部品を識別するための名前を指定します。
この属性の値は、入力されたデータ（または初期値）とセットで送信されることになります。
■cols="" （入力欄の幅を文字数で指定）
入力欄の横幅を文字数で指定します。
この属性を指定した場合でも、ブラウザにより見た目の幅は異なります。同じような幅で表示させたい場合は、同時にスタイルシートも指定しておきます。
■rows="" （入力欄の高さを行数で指定）
入力欄の高さを行数で指定します。入力内容がこの高さを超えた場合は、入力欄にスクロールバーが表示されます。
この属性を指定した場合でも、ブラウザにより見た目の高さは異なります。同じような高さで表示させたい場合は、同時にスタイルシートも指定しておきます。
【入力欄の初期値について】
textarea要素内の文字列は、初期値として入力欄に表示されることになります。
<textarea name="example" cols="50" rows="10">
この文字列が初期値として表示されます
</textarea>
【その他の属性】
以下の属性で、部品の無効化と書き換えの禁止を指定することができます。（主に、JavaScript等と組み合わせて使用することになります）
| 属性 | 値 | 説明 |
|---|---|---|
| disabled | 値は不要 | 部品を無効化する |
| readonly | 値は不要 | 書き換えを禁止する |
■disabled （部品を無効化する）
この属性が指定された部品は、選択や書き換えができなくなり、データも送信されなくなります。
■readonly （書き換えを禁止する）
この属性が指定された部品は、書き換えだけができなくなります。選択することは可能で、データも送信されることになります。
入力欄のサイズや背景色等は、スタイルシートでアレンジすることができます。指定方法の詳細は「関連ページ」をご覧ください。
使用例
<form method="post" action="example.cgi">
<p>幅と高さを指定<br>
<textarea name="example1" cols="50" rows="5"></textarea></p>
<p>初期値を指定<br>
<textarea name="example2" cols="50" rows="5">
この文字列が
初期値として
表示されます。
</textarea></p>
<p>部品を無効化する<br>
<textarea name="example3" cols="50" rows="5" disabled>部品を無効化</textarea></p>
<p>書き換えを禁止する<br>
<textarea name="example4" cols="50" rows="5" readonly>書き換えを禁止</textarea></p>
<p><input type="submit" value="送信する"></p>
</form>
表示例
幅と高さを指定
初期値を指定
部品を無効化する
書き換えを禁止する
※サンプルのため送信できません。
- サイト内検索
