資料結構
網路
關係資料庫管理系統 (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> rows 屬性。
<!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+ 瀏覽量
廣告