Comment définir la largeur de l'élément en CSS-tutoriel CSS-php.cn

Comment définir la largeur de l'élément en CSS

青灯夜游

Libérer： 2023-01-11 09:19:56

original

8920 Les gens l'ont consulté

Méthode de réglage : 1. Utilisez l'attribut width pour définir la largeur, la syntaxe "width: width value;"; 2. Utilisez l'attribut min-width pour définir la largeur minimale, la syntaxe "min-width: width value;" "; 3. Utiliser max-width L'attribut définit la largeur maximale, la syntaxe est "max-width: width value;".

Comment définir la largeur de l'élément en CSS

L'environnement d'exploitation de ce tutoriel : système Windows7, version CSS3&&HTML5, ordinateur Dell G3.

css set element width

1 Utilisez l'attribut width

width pour définir la largeur de l'élément. Cet attribut définit la largeur de la zone de contenu de l'élément, et un remplissage, des bordures et des marges peuvent être ajoutés en dehors de la zone de contenu.

<html>
<head>
<style type="text/css">
img
{
width: 300px
}
</style>
</head>
<body>

<img  src="eg_smile.gif" / alt="Comment définir la largeur de l'élément en CSS" >

</body>
</html>

Copier après la connexion

Rendu :

Comment définir la largeur de lélément en CSS

2. Utilisez l'attribut min-width

min-width pour définir la largeur minimale de l'élément. Cette valeur d'attribut définit une limite minimale sur la largeur de l'élément. Par conséquent, l’élément peut être plus large que la valeur spécifiée, mais pas plus étroit. Les valeurs négatives ne peuvent pas être spécifiées.

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <style type="text/css">
    	.min{
    		min-width: 300px;
    	}
    </style>
  </head>
  <body>
  	<textarea>文本框默认宽度</textarea><br>
    <textarea class="min">文本框最小宽度300px</textarea>
  </body>
</html>

Copier après la connexion

Rendu :

Comment définir la largeur de lélément en CSS

3. Utilisez l'attribut max-width

max-height pour définir la hauteur maximale de l'élément. Cette valeur d'attribut définit une limite maximale sur la hauteur de l'élément. Par conséquent, l’élément peut être plus court que la valeur spécifiée, mais pas plus grand. Les valeurs négatives ne peuvent pas être spécifiées.

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
  </head>
  <body>
  	<textarea>文本框默认宽度</textarea><br>
    <textarea style="max-width: 400px;">文本框最大宽度400px</textarea>
  </body>
</html>

Copier après la connexion

Rendu :

Comment définir la largeur de lélément en CSS