Heim  >  Artikel  >  Web-Frontend  >  Wie zentriere ich CSS-Text vertikal? 4 Möglichkeiten, eine horizontale Zentrierung von CSS-Text zu erreichen

Wie zentriere ich CSS-Text vertikal? 4 Möglichkeiten, eine horizontale Zentrierung von CSS-Text zu erreichen

云罗郡主
云罗郡主Original
2018-10-31 15:14:2311662Durchsuche

Derzeit gibt es viele Möglichkeiten, CSS-Stile zur horizontalen Zentrierung zu verwenden, aber viele Leute wissen nicht, wie sie die horizontale CSS-Zentrierungsmethode auswählen sollen. Nachfolgend fasst unsere chinesische PHP-Website für Sie zusammen, wie Sie CSS-Text horizontal zentrieren vertikal? Und 4 Methoden, um eine horizontale Zentrierung von CSS-Text zu erreichen.

Wie zentriere ich CSS-Text vertikal? 4 Möglichkeiten, eine horizontale Zentrierung von CSS-Text zu erreichen

Es ist nicht einfach, Text horizontal und vertikal zu zentrieren. Einige Anfänger verwenden CSS-Methoden, um eine CSS-Zentrierung zu erreichen, die in Browsern nicht verfügbar ist Dies kann auf Kompatibilitätsprobleme oder einige nicht gängige Browser zurückzuführen sein. [Empfohlene Lektüre: Verwenden Sie CSS, um eine horizontale Zentrierung der DIV-Anzeige zu erreichen]

1. Verwenden Sie absolute Positionierung in Kombination mit Rand: Auto

Rand: Auto-Eigenschaften: Nach dem Rand gibt es vier Eigenschaften: Oben, Unten, Links und Rechts. Solange wir den Rand auf Auto setzen, können wir ihn zuerst horizontal zentrieren.

2. Verwenden Sie die absolute Positionierung und verwenden Sie das Transformationsattribut, um

Der Standardwert von transform ist „none“, der Effekt besteht darin, dass eine Transformation stattfindet, und der geerbte Wert ist Nein. Der einzige Vorteil der Verwendung von Transformation besteht darin, dass Sie die Größe des Elements nicht kennen müssen und der Prozentsatz des Versatzes der Transformation relativ zur Größe des Elements ist.

3. Verwenden Sie das Div in der absoluten Positionierung , stellen Sie den oberen Rand des Div auf 50 % und den oberen Rand auf einen negativen Wert px ein Verschachtelte Tags festlegen Besser geeignet für alle Browser, aber zuerst müssen Sie die Größe kennen, die zentriert werden soll.

4. Das Padding-Attribut kann die Zentrierung des Elements realisieren

Das Padding-Attribut dient tatsächlich dazu, den Abstand des inneren Randes und die Breite des oberen Randes festzulegen , unterer, linker und rechter Rand Diese Methode ist praktischer. Solange wir gleiche Ränder festlegen, erfolgt eine vertikale Zentrierung der Elemente.

Oben geht es darum, wie man CSS-Text vertikal zentriert. Eine vollständige Einführung in die 4 Methoden zur horizontalen Zentrierung von CSS-Text. Wenn Sie mehr über das CSS-Tutorial erfahren möchten, schauen Sie sich bitte die chinesische PHP-Website an.


Das obige ist der detaillierte Inhalt vonWie zentriere ich CSS-Text vertikal? 4 Möglichkeiten, eine horizontale Zentrierung von CSS-Text zu erreichen. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

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

In Verbindung stehende Artikel

Mehr sehen