Heim > Artikel > Web-Frontend > So zentrieren Sie vertikalen Text in CSS
Methode: 1. Verwenden Sie das Attribut „writing-mode“, um die vertikale Textanzeige festzulegen, die Syntax „text element {writing-mode:vertical-lr}“ 2. Verwenden Sie das Attribut „text-align“, um das festzulegen Um vertikalen Text zu zentrieren, verwenden Sie die Syntax „Textelement {text-align:center}“.
Die Betriebsumgebung dieses Tutorials: Windows 10-System, CSS3- und HTML5-Version, Dell G3-Computer.
So zentrieren Sie vertikalen Text in CSS
In CSS können Sie das Attribut „writing-mode“ verwenden, um die vertikale Anzeige von Text festzulegen, und Sie können das Attribut „text-align“ verwenden, um den Text so einzustellen, dass er zentriert wird .
Die Eigenschaft writing-mode definiert, wie Text horizontal oder vertikal angeordnet wird.
Das Beispiel sieht wie folgt aus:
<!DOCTYPE html> <html> <head> <title>test</title> <meta charset="UTF-8"> </head> <style> .one { width:200px; height: 140px; border:1px solid #000; writing-mode: vertical-lr; text-align:center; } </style> <body> <div class="one">好好学习</div> </body> </html>
Ausgabeergebnis:
(Lernvideo-Sharing: CSS-Video-Tutorial)
Das obige ist der detaillierte Inhalt vonSo zentrieren Sie vertikalen Text in CSS. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!