Heim  >  Artikel  >  Web-Frontend  >  So lassen Sie Text in CSS3 vertikal zentriert erscheinen

So lassen Sie Text in CSS3 vertikal zentriert erscheinen

王林
王林Original
2020-11-20 09:12:452597Durchsuche

Css3-Methode zum vertikalen Zentrieren von Text: Dies kann durch die Verwendung absoluter Positionierungs- und Transformationsattribute wie [position:relative; transform:translate(50%,-50%);] erreicht werden.

So lassen Sie Text in CSS3 vertikal zentriert erscheinen

Implementierungsidee:

Erreicht durch die Verwendung absoluter Positionierungs- und Transformationsattribute.

(Video-Tutorial-Empfehlung: CSS-Video-Tutorial)

Attributeinführung:

Transformationsattribut wird auf die 2D- oder 3D-Transformation des Elements angewendet. Mit dieser Eigenschaft können Sie das Element drehen, skalieren, verschieben, neigen usw.

Syntax:

transform: none|transform-functions;

Testcode:

So lassen Sie Text in CSS3 vertikal zentriert erscheinen

Erklärung:

Der offensichtliche Vorteil dieser Methode besteht darin, dass Sie die Größe des zentrierten Elements nicht im Voraus kennen müssen, da der Versatzprozentsatz in der Transformation ist in Bezug auf die Größe relativ zum Element selbst.

Verwandte Empfehlungen: CSS-Tutorial

Das obige ist der detaillierte Inhalt vonSo lassen Sie Text in CSS3 vertikal zentriert erscheinen. 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