ホームページ > ウェブフロントエンド > htmlチュートリアル > HTMLのtextareaタグの使い方を詳しく解説

HTMLのtextareaタグの使い方を詳しく解説

不言
リリース: 2019-01-16 15:37:54
オリジナル
40007 人が閲覧しました

textarea タグは、複数行のテキスト入力コントロールを定義するために使用されます。テキスト入力フィールドには任意の長さのテキストを入力できます。ここに入力した値をPHPなどのプログラムを使ってサーバーに送信することもできます。今回はHTMLにおけるtextareaタグの使い方を詳しく紹介します。

HTMLのtextareaタグの使い方を詳しく解説

まず、input タグと textarea タグの違いを簡単に見てみましょう

type 属性を text に設定すると、 input タグは、textarea タグと同様の効果を実現できます。

ただし、input タグを使用して入力できるのは 1 行のテキストのみです。複数行のテキストを入力したい場合は、textarea タグを使用できます。

textareaタグの使い方は?

textarea タグを使用して行数と列数を指定できます

コードは次のとおりです

<HTMLのtextareaタグの使い方を詳しく解説>
    <form action="/form.php" method="post">
        <div>
            <label for="message">内容</label>
            <textarea id="message" name="message" cols="50" rows="10"></textarea>
        </div>
        <input type="submit" value="发送">
    </form>
</HTMLのtextareaタグの使い方を詳しく解説>
ログイン後にコピー

実行結果は次のとおりです

HTMLのtextareaタグの使い方を詳しく解説

textareaタグでは、cols属性(横方向)とrows属性(縦方向)でそれぞれサイズが決まります。

#最大文字数を決定します

サンプルコードは次のとおりです

<HTMLのtextareaタグの使い方を詳しく解説>
    <form action="/form.php" method="post">
        <div>
            <label for="message">内容</label>
            <textarea id="message" name="message" cols="50" rows="10" maxlength="20"></textarea>
        </div>
        <input type="submit" value="发送">
    </form>
</HTMLのtextareaタグの使い方を詳しく解説>
ログイン後にコピー

実行結果は次のとおりです

HTMLのtextareaタグの使い方を詳しく解説

この場合、上記のコードに加えて、maxlength 属性を使用して最大文字数を設定します。

最後に、事前に作成されたテキストを変更できないように textarea タグを設定することもできます。

コードは次のとおりです。

<HTMLのtextareaタグの使い方を詳しく解説>
    <form action="/form.php" method="post">
        <div>
            <label for="message">内容</label>
            <textarea id="message" name="message" cols="50" rows="10" maxlength="20" readonly>这有这个内容</textarea>
        </div>
        <input type="submit" value="发送">
    </form>
</HTMLのtextareaタグの使い方を詳しく解説>
ログイン後にコピー
実行中の結果は以下の通りです。

HTMLのtextareaタグの使い方を詳しく解説

今回はreadonly属性を設定することで、追加した内容は変更できないように設定しました。

上記はこの記事の全内容です。さらに興味深い内容については、php 中国語 Web サイトの関連コラム チュートリアルに注目してください。 ! !

以上がHTMLのtextareaタグの使い方を詳しく解説の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート