HTML <textarea>元素用於Web表單中的多行文本輸入，支持線路斷裂和大型文本塊。 2?；緦傩园ū韱翁峤坏拿Q，高度的行和寬度的COLS，而CSS則首選用於響應(yīng)式設(shè)計(jì)。 3。 CSS屬性，例如寬度，高度，填充和調(diào)整大小，可以更好地控制外觀和用戶交互。 4。在表單提交期間，<textarea>將內(nèi)容作為純文本發(fā)送，並保留為\ n，可通過服務(wù)器上的名稱屬性訪問。 5。有用的屬性包括提示的佔(zhàn)位符，字符限制的最大長度，驗(yàn)證所需的以及用於交互控制的禁用或可讀性。 6.最佳實(shí)踐包括使用名稱屬性，與配對(duì)以供訪問性，避免在標(biāo)籤中避免佔(zhàn)位符文本，以及在顯示輸出時(shí)適當(dāng)斷路。 <textarea>元素與適當(dāng)?shù)膶傩院蜆邮较嘟Y(jié)合時(shí)，對(duì)於用戶生成的內(nèi)容而言，卻很簡單，但功能強(qiáng)大。

HTML <textarea></textarea>元素是允許用戶在Web表單中輸入多行文本的標(biāo)準(zhǔn)方法。與<input type="text">之類的單線輸入不同， <textarea></textarea>自然支持線路斷裂和更大的文本塊，使其非常適合評(píng)論，描述，消息等。

基本語法和用法

要?jiǎng)?chuàng)建多行文本輸入，請(qǐng)使用<textarea></textarea>標(biāo)籤。這是一個(gè)配對(duì)的元素，這意味著它需要打開和關(guān)閉標(biāo)籤。標(biāo)籤內(nèi)的文字是默認(rèn)或占位符內(nèi)容。

 <textarea name =“ message” rows =“ 5” cols =“ 30”>
在這裡寫你的消息...
</textarea>

• name ：在提交表單時(shí)標(biāo)識(shí)字段。
• rows ：指定可見線數(shù)（高度）。
• cols ：將可見寬度設(shè)置為平均角色寬度。

這些屬性可以提供基本的尺寸，但是為了更好地控制，建議使用CSS。

使用CS自定義尺寸和外觀

rows和cols工作的同時(shí)，使用CSS提供了更大的靈活性和響應(yīng)能力。

 <textarea name =“ comment” class =“文本輸入”> </textarea>

 .text輸入{
  寬度：100％；
  身高：150px;
  填充：10px;
  字體大?。?6px;
  邊界：1PX實(shí)心#CCC;
  邊界拉迪烏斯：4PX；
  調(diào)整大?。捍怪?； / *或'none'，“兩個(gè)”，“水平” */
}

• 使用height和width ，以跨設(shè)備的尺寸保持一致。
• resize控制用戶是否可以手動(dòng)調(diào)整文本方面的大小。如果要鎖定大小，則設(shè)置為none 。

處理表格提交

提交表單後， <textarea>將其內(nèi)容作為純文本發(fā)送，保留線路斷路（以\n的提交）。

 <form action =“/submit” method =“ post”>
  <=“ bio”>關(guān)於你自己的標(biāo)籤：</label>
  <textarea name =“ bio” id =“ bio”行=“ 4” cols =“ 50”> </textarea>
  <button類型=“提交”>提交</button>
</form>

在服務(wù)器端（例如，PHP，Node.js），您將在name屬性（在這種情況下為bio ）中收到值，包括線路斷路。

其他有用的屬性

• placeholder ：向用戶展示提示（鍵入時(shí)消失）。

   <textarea佔(zhàn)位符=“輸入您的反饋...”> </textarea>

• maxlength ：限製字符的數(shù)量。

   <textarea maxlength =“ 200”> </textarea>

• required ：確保該字段不要空空。

   <Textarea必需> </textarea>

• disabled或readonly ：控制用戶交互。

   <Textarea禁用>無法編輯此</textarea>

  筆記和最佳實(shí)踐

  • 始終包含一個(gè)name屬性，以便將其發(fā)送的數(shù)據(jù)發(fā)送。
  • 避免將佔(zhàn)位符文本放在<textarea></textarea>標(biāo)籤中 - 改用placeholder屬性。
  • 有關(guān)可訪問性，請(qǐng)將TextArea與a for and id配對(duì)<label></label> 。
  • 提交的文本中的線斷裂可能需要根據(jù)您顯示的位置進(jìn)行處理（例如，html忽略\n ，因此在需要時(shí)轉(zhuǎn)換為<br> ）。

  基本上， <textarea></textarea>易於使用，但對(duì)於用戶生成的內(nèi)容而言強(qiáng)大。具有適當(dāng)?shù)膶傩院蜕倭緾SS，可干淨(jìng)地符合任何形式。

  以上是如何將HTML Textarea用於多行文本輸入的詳細(xì)內(nèi)容。更多資訊請(qǐng)關(guān)注PHP中文網(wǎng)其他相關(guān)文章！