Comment définir la hauteur et la largeur en CSS-tutoriel CSS-php.cn

Comment définir la hauteur et la largeur en CSS

青灯夜游

Libérer： 2023-01-05 16:10:27

original

10660 Les gens l'ont consulté

Comment définir la hauteur et la largeur en CSS : 1. Utilisez les attributs width et height pour définir la largeur et la hauteur de l'élément 2. Utilisez les attributs max-width et max-height pour définir la largeur maximale ; et la hauteur de l'élément 3. Utilisez min Les attributs -width et min-height définissent la largeur et la hauteur minimales de l'élément.

Comment définir la hauteur et la largeur en CSS

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

Méthode 1 : Utiliser les attributs width et height

Les attributs width et height peuvent définir la largeur et la hauteur de l'élément. Ils définissent la largeur et la hauteur de l'élément. zone de contenu de l'élément. Incluez le remplissage, les bordures ou les marges.

Valeur de l'attribut :

值	描述
auto	默认值。浏览器可计算出实际的宽度或高度。
length	使用 px、cm 等单位定义宽度或高度。
%	基于包含它的块级对象（父元素）的百分比宽度或高度。

Méthode 2 : Utiliser les attributs max-width et max-height

attributs max-width et max-height Définissez la largeur et la hauteur maximales d'un élément, sans compter le remplissage, les bordures ou les marges !

Valeur d'attribut :

值	描述
none	默认。定义对元素的最大宽度或高度没有限制。
length	定义元素的最大宽度值或最大高度值。
%	定义基于包含它的块级对象的百分比最大宽度或最大高度。

Exemple :

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"> 
<style>
p
{
	max-width:100px;
	max-height:100px;
	background-color:yellow;
}
</style>
</head>

<body>
<p>这一段的最大宽度设置为100 px，最大高度设置为100 px。</p>
</body>
</html>

Copier après la connexion

Comment définir la hauteur et la largeur en CSS

Méthode 3 : Utiliser min-width et min-height Propriétés

Les propriétés min-width et min-height définissent la largeur et la hauteur minimales d'un élément, sans compter le remplissage, les bordures ou les marges !

Valeur de l'attribut :

值	描述
length	定义元素的最小宽度或最小高度。默认值是 0。
%	定义基于包含它的块级对象的百分比最小宽度或最小高度。

Exemple :

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"> 
<style>
p
{
	min-width:150px;
	min-height:100px;
	background-color:yellow;
}
</style>
</head>

<body>
<p>这个段落的最小宽度设置为 150px，最小高度设置为 100px。</p>
</body>
</html>

Copier après la connexion

Comment définir la hauteur et la largeur en CSS