Home >Web Front-end >Front-end Q&A >How to set the size of the text field in html

How to set the size of the text field in html

青灯夜游
青灯夜游Original
2021-03-05 17:52:397385browse

In HTML, you can use the width attribute and height attribute to set the size of the text area. You only need to add the "width: width value; height: height value;" style to the text area label textarea.

How to set the size of the text field in html

The operating environment of this tutorial: Windows 7 system, CSS3&&HTML5 version, Dell G3 computer.

htmlText field

There is also a specially defined text style in HTML, called text city. The difference between it and a text box is that you can add multiple lines of text, so you can enter more text. This type of control is most common on some message boards.

The syntax is as follows:

<textarea name="文本域名称”value="文本域默认值"  rows="行教”cols="列数"></textarea>
Text field label attribute
Text field label attribute Description
name The name of the text field
rows The number of rows in the text field
cols The number of columns in the text field
#value The default value of the text field

[Recommended tutorial: "html video tutorial"]

htmlHow to set the size of the text field

<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<style type="text/css">
			#text2 {
				width: 200px;
				height: 200px;
			}
		</style>
	</head>

	<body>

		<form action="#" method="post">
			文本域:<br /><br />
			<textarea id="text1" name="description">默认大小 </textarea><br /><br />
			<textarea id="text2" name="description">使用width属性和height属性设置文本域的宽度为200px,高度为200px。</textarea>
		</form>

	</body>

</html>

Rendering :

How to set the size of the text field in html

css width and height attributes

The width attribute sets the width of the element.

The height attribute sets the height of the element.

Value Description
auto Default value. The browser can calculate the actual width or height.
length Define width or height using units such as px, cm, etc.
% # Defines a percentage width or height based on the width of the containing block (parent element).

For more programming related knowledge, please visit: Programming Video! !

The above is the detailed content of How to set the size of the text field in html. For more information, please follow other related articles on the PHP Chinese website!

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn