HTML中textarea標籤的用法詳解

textarea標籤是用來定義一個多行的文字輸入控件，在文字輸入域中可以輸入任意長度的文字。也可以使用PHP等程式將此處輸入的值傳送到伺服器，本篇文章我們就來詳細介紹關於HTML中textarea標籤的用法。

我們先來簡單看一下input標籤和textarea標籤之間的區別

透過將type屬性設定為text ， input標籤可以獲得與textarea標籤類似的效果。

但是，使用input標籤只能輸入一行文本，如果你想輸入多行文本，我們可以使用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標籤的用法詳解>

運行效果如下

在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標籤的用法詳解>

運行結果如下

#在這種情況下，除了上面的程式碼之外，還使用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標籤的用法詳解>

運行結果如下

在這種情況下，透過設定 readonly屬性，我將其設定為不能更改已新增的內容。

以上就是本篇文章的全部內容了，更多精彩內容大家可以關注php中文網的相關欄位教學！ ！ ！

#######

以上是HTML中textarea標籤的用法詳解的詳細內容。更多資訊請關注PHP中文網其他相關文章！