HTML - cols 属性_HTML 菜鸟教程

HTML cols 属性用于设置或指定文本区域元素的可见宽度。如果它在 textarea 元素中使用。

如果我们没有为 cols 属性指定任何值，它将自动考虑默认值，即 20。我们可以使用 CSS width 属性来设置此元素的可见宽度，而不是 cols 属性。

cols 属性适用于 <textarea> 和 <frameset> 标签，由于 HTML5 不支持 <frameset> 标签，我们将仅将其与 <textarea>一起使用。

语法


<textarea cols = "value"></textarea>

适用于

下面列出的元素允许使用 HTML cols 属性

元素	描述
<textarea>	HTML<textarea>标签用于输入多行文本。
<frameset>	HTML<frameset>标签用于指定frameset中的行数和列数及其像素。

HTML cols 属性的示例

以下代码演示了 cols 属性的用法

具有指定宽度的 Cols 属性

在以下示例中，我们在 textarea 字段中使用 HTML 'cols' 属性来指定此元素的可见宽度。


<!DOCTYPE html>
<html lang="en">

<head>
	 <title>HTML 'cols' attribute</title>
</head>

<body>
	 <!--HTML 'cols' attribute-->
	 <p>Example of the HTML 'cols' attribute</p>
	 <form>
			<label>Message: </label>
			<br>
			<textarea 
				 cols="30" 
				 rows="10" 
				 placeholder="Write your message...">
			</textarea>
			<br>
			<button>Submit</button>
	 </form>
</body>

</html>

具有默认值的 Cols 属性

在此示例中，我们在 textarea 元素中使用了 'cols' 属性，但我们没有为其分配任何值。但它会在网页上以 20 列的值（即默认值）显示。


<!DOCTYPE html>
<html lang="en">

<head>
	 <title>HTML 'cols' attribute</title>
</head>

<body>
	 <!--HTML 'cols' attribute-->
	 <p>Example of the HTML 'cols' attribute</p>
	 <form>
			<label>Address</label>
			<br>
			<textarea cols="" rows="5"></textarea>
			<br>
			<button>Submit</button>
	 </form>
</body>

</html>

支持的浏览器

浏览器
是否支持	Yes	Yes	Yes	Yes	Yes

<< HTML - color 属性 HTML - colspan 属性 >>