Maison > interface Web > tutoriel CSS > Comment définir la largeur et la hauteur de la zone de texte en CSS

Comment définir la largeur et la hauteur de la zone de texte en CSS

青灯夜游
Libérer: 2023-01-04 09:38:52
original
12849 Les gens l'ont consulté

Vous pouvez utiliser les attributs width et height en CSS pour définir la largeur et la hauteur de la zone de texte. Il vous suffit d'ajouter les styles "width: value;" et "height: value;" élément de boîte (entrée ou zone de texte). L'attribut width définit la largeur de l'élément et l'attribut height définit la hauteur de l'élément.

Comment définir la largeur et la hauteur de la zone de texte en CSS

L'environnement d'exploitation de ce tutoriel : système Windows 7, version css1&&html5, ordinateur Dell G3.

Recommandation du tutoriel : Tutoriel vidéo CSS

Comment définir la largeur et la hauteur de la zone de texte en CSS

Donner l'élément de zone de texte ( ,

L'attribut width définit la largeur de l'élément et l'attribut height définit la hauteur de l'élément.

Comment définir la largeur et la hauteur de la zone de texte en CSSComment définir la largeur et la hauteur de la zone de texte en CSS

Remarque : les propriétés width et height n'incluent pas le remplissage, les bordures ou les marges !

Exemple :

<!DOCTYPE html>
<html>
 
	<head>
		<meta charset="UTF-8">
		<style type="text/css">
			.input{
				width: 200px;
				height: 100px;
			}
			.textarea{
				idth: 200px;
				height: 100px;
			}
		</style>
	</head>
 
	<body>
		<input type="text" placeholder="默认单行文本框" />
		<input type="text" class="input" placeholder="设置宽度200px,高度100px" /><br /><br />
		<textarea placeholder="默认多行文本框"></textarea>
		<textarea class="textarea" placeholder="设置宽度200px,高度100px"></textarea>
	</body>
 
</html>
Copier après la connexion

Rendu :

Comment définir la largeur et la hauteur de la zone de texte en CSS

Pour plus de connaissances sur la programmation, veuillez visiter : Cours de programmation ! !

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal