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!
![[Web-Frontend] Node.js-Schnellstart](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
