資料結構
網路
關係資料庫管理系統 (RDBMS)
作業系統
Java
MS Excel
iOS
HTML
CSS
Android
Python
C 語言程式設計
C++
C#
MongoDB
MySQL
Javascript
PHP
物理學
化學
生物學
數學
英語
經濟學
心理學
社會學
服裝學
法學如何在 HTML 中設定文字區域中可見的行數？
本文將教你如何在 HTML 中設定文字區域中可見的行數。HTML 的 <textarea> 元素對於多行編輯控制元件非常有用，允許使用者輸入大量自由格式文字。
語法
以下是設定文字區域中可見行數的語法：
<textarea rows = "value">
要顯示控制元件的行數或可見文字行數，可以使用 HTML textarea 的 rows 屬性指定。此外，它還指定了文字區域的可見高度。
以下是關於如何在 HTML 中設定文字區域中可見行數的示例。
示例 1
在下面的示例中，我們使用了帶有 rows 和 cols 屬性的 <textarea> 屬性。
<!DOCTYPE html>
<html>
<body>
<textarea rows="7" cols="25">
Doorno:11/2
kavuri hills phase2
madhapur,hyderabad
telangana
</textarea>
<input type = "submit" value = "submit" />
</body>
</html>
執行上述指令碼後，它將生成一個包含文字區域欄位中文字的輸出，使用 textarea rows 屬性使行可見。
示例 2：使用 Javascript
在下面的示例中，我們執行一個指令碼以使文字區域中的行可見。
<!DOCTYPE html>
<html>
<body>
<textarea id="mytutorial" rows="6" cols="50">
Mahendra Singh Dhoni is an Indian former professional cricketer
who was captain of the Indian national cricket team in limited-overs
formats from 2007 to 2017 and in Test cricket from 2008 to 2014.
</textarea>
<p>Click To Change Number Of Visible Rows</p>
<button type="button" onclick="mytutorial1()">Click</button>
<script>
function mytutorial1() {
document.getElementById("mytutorial").rows = "10";
}
</script>
</body>
</html>
執行上述指令碼後，它將在網頁上生成一個包含填充文字的文字區域欄位以及提示和點選按鈕的輸出。
當用戶點選按鈕時，事件會被觸發，並增加文字區域中可見行的數量。
示例 3
在下面的示例中，我們使用 <textarea> rows 屬性來設定可見的行數。
<!DOCTYPE html>
<html>
<head>
<title>HTML rows attribute</title>
</head>
<body>
<form action = "/cgi-bin/hello_get.cgi" method = "get">Enter subject<br />
<textarea rows = "5" cols = "50" name = "description"></textarea><br>
<input type = "submit" value = "submit" />
</form>
</body>
</html>
當指令碼執行時，它將生成一個輸出，其中包含一個文字區域欄位供使用者輸入提及的文字，以及一個 rows 屬性，以便在網頁上顯示可見的行。
更新於：2022年12月15日
4K+ 瀏覽量
廣告