Maison > interface Web > tutoriel CSS > le corps du texte

Comment mettre en retrait un paragraphe en CSS

青灯夜游
Libérer: 2021-02-25 11:44:28
original
7821 Les gens l'ont consulté

En CSS, vous pouvez utiliser l'attribut text-indent pour mettre en retrait un paragraphe de texte. Il vous suffit d'ajouter le style "text-indent: indent value;" à l'élément paragraphe. L'attribut text-indent peut définir le retrait de la première ligne de texte dans le bloc de texte, autorisant des valeurs négatives ; si la valeur est un nombre négatif, la première ligne restera en retrait.

Comment mettre en retrait un paragraphe en CSS

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

Recommandation du tutoriel : Tutoriel vidéo CSS

Retrait du paragraphe CSS

Si vous souhaitez modifier le style par défaut du paragraphe élément, let Pour mettre en retrait les paragraphes, vous pouvez utiliser l'attribut text-indent.

L'attribut text-indent spécifie l'indentation de la première ligne de texte dans un bloc de texte. Les valeurs négatives sont autorisées ; si la valeur est négative, la première ligne reste en retrait.

Valeur de l'attribut :

  • la longueur définit l'indentation fixe. Valeur par défaut : 0.

  • % Définit le retrait en fonction d'un pourcentage de la largeur de l'élément parent.

Exemple :

<!DOCTYPE html>
<html>
 
	<head>
		<meta charset="UTF-8">
		<style type="text/css">
			p{width: 200px;border: 1px solid red;}
			.text-indent{text-indent:2em;}
		</style>
	</head>
 
	<body>
		<p>测试文本!测试文本!测试文本!测试文本!测试文本!</p>
		<p class="text-indent">测试文本!测试文本!测试文本!测试文本!测试文本!</p>
	</body>
 
</html>
Copier après la connexion

L'élément p avec la classe text-indent sera indenté de la longueur de 2 polices.

Rendu :

Comment mettre en retrait un paragraphe en CSS

Pour plus de connaissances liées à la programmation, veuillez visiter : Enseignement de la 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