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

Comment centrer le texte CSS

anonymity
Libérer: 2019-05-28 15:23:41
original
12390 Les gens l'ont consulté

CSS text-align

syntaxe d'alignement de texte :

text-align : left | right | center | justify
Copier après la connexion

valeur et description du paramètre d'alignement de texte :

gauche : alignement à gauche

droite : Aligné à droite

centre : Centré

*justifier : Aligné aux deux extrémités (non recommandé, généralement non utilisé par la plupart des navigateurs)

nous Les valeurs de paramètres couramment utilisées pour text-align sont gauche, droite, centre

description de la fonction text-align :

Définir ou récupérer l'alignement gauche-centre-droit du texte dans l'objet .

Comment centrer le texte CSS

Exemple de cas :

Nous avons configuré 3 boîtes, définissons la hauteur CSS et la largeur CSS des boîtes pour qu'elles soient identiques , puis définissez-les séparément. Le contenu des trois zones est aligné à gauche, au centre et à droite.

Nous définissons la hauteur des trois cases à 50px et la largeur à 300px ; pour faciliter l'observation, nous définissons les trois cases pour qu'elles aient un style de bordure noire.

1, code HTML+CSS

1), code CSS

.div1{ width:300px; height:50px; border:1px solid #000; text-align:left} 
.div2{ width:300px; height:50px; border:1px solid #000; text-align:center} 
.div3{ width:300px; height:50px; border:1px solid #000; text-align:right} 
/*  
div1 div2 div3 分别设置 靠左 居中 靠右对齐 
*/
Copier après la connexion

2), code HTML

<div class="div1">我被靠左对齐</div> 
<div class="div2">我被居中显示</div> 
<div class="div3">我被靠右对齐</div>
Copier après la connexion

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:
css
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