Heim > Web-Frontend > CSS-Tutorial > So legen Sie die Ausrichtung der Textmitte in CSS fest

So legen Sie die Ausrichtung der Textmitte in CSS fest

王林
Freigeben: 2023-01-03 09:28:10
Original
12788 Leute haben es durchsucht

So legen Sie die zentrierte Ausrichtung von Text in CSS fest: Sie können das text-align-Attribut verwenden, z. B. [p{text-align:center;}]. Wir können den Text auch nach links oder rechts setzen, z. B. [text-align:left;] oder [text-align:right;].

So legen Sie die Ausrichtung der Textmitte in CSS fest

Die Betriebsumgebung dieses Artikels: Windows 10-System, CSS 3, Thinkpad T480-Computer.

Es gibt ein Textattribut text-align in CSS, mit dem wir die horizontale Ausrichtung des Texts des Elements angeben können, z. B. zentriert, links, rechts, ausgerichtet usw.

Attributwert:

  • left Ordnet den Text links an. Standard: Wird vom Browser bestimmt.

  • rechts Ordne den Text rechts an.

  • Mitte Ordnen Sie den Text in der Mitte an.

  • justify erreicht den Effekt, dass Text an beiden Enden ausgerichtet wird.

  • inherit gibt an, dass der Wert des text-align-Attributs vom übergeordneten Element geerbt werden soll.​

Was sollen wir beispielsweise tun, wenn wir den Text zentriert ausrichten möchten?

Spezifischer Implementierungscode:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"> 
<title>php.cn</title> 
<style>
p{
    width:500px;
    border:2px solid red;
    text-align:center;
}
</style>
</head>

<body>
<h2>文本居中对齐</h2>
<p>居中的文本</p>
</body>
</html>
Nach dem Login kopieren

(Teilen von Lernvideos: CSS-Video-Tutorial)

Laufende Ergebnisse:

So legen Sie die Ausrichtung der Textmitte in CSS fest

Verwandte Empfehlungen: CSS-Tutorial

Das obige ist der detaillierte Inhalt vonSo legen Sie die Ausrichtung der Textmitte in CSS fest. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage