So realisieren Sie die vertikale Anordnung von Text mithilfe von CSS-CSS-Tutorial-php.cn

So realisieren Sie die vertikale Anordnung von Text mithilfe von CSS

云罗郡主

Freigeben： 2018-11-23 17:25:13

Original

2970 Leute haben es durchsucht

Der Inhalt dieses Artikels befasst sich mit der Verwendung von CSS zur Erzielung einer vertikalen Textanordnung. Freunde in Not können darauf verweisen.

So realisieren Sie die vertikale Anordnung von Text mithilfe von CSS

Es gibt zwei wichtige Attribute in den Textverarbeitungsattributen des Stylesheets: Schreibmodus und Textausrichtung. Werfen wir zunächst einen Blick auf ihre Verwendung:

1. Schreibmodus (Objektschreibrichtung festlegen)

Syntax: Schreibmodus: lr-tb, tb-rl

Parameter: lr-tb: von links nach rechts, von oben nach unten tb-rl: von oben nach unten, von rechts nach links

Beispiel:

CSS-Code kopiert Inhalte in die Zwischenablage

div { writing-mode: tb-rl; }

Nach dem Login kopieren

2. text-align (Legen Sie die Ausrichtung des Textes im Objekt fest)

Syntax: text-align: links, rechts, zentriert, justify

Parameter: links : Links ausrichten rechts: Rechts ausrichten Mitte: Mitte ausrichten: Beide Enden ausrichten

Beispiel:

CSS-Code Inhalt in die Zwischenablage kopieren

div { text-align : center; }

Nach dem Login kopieren

Und die üblichen Layout-Ideen: Rechts Die Breiteneinstellung des Textobjekts kann nur den Breitenabstand des nächsten Textes festlegen. Wenn der Text nicht in eine Zeile passt, wird der Text automatisch umbrochen, was einen vertikalen Schriftsatz erforderlich macht.

CSS-Code kopiert Inhalte in die Zwischenablage

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>竖列排版实例 在线演示 www.divcss8.com</title>
<style>
body{text-align:center}
.shuli{ margin:0 auto;width:20px;line-height:24px;border:1px solid #333}
</style>
</head>
<body>
<div class="shuli">我是竖列排版</div>
</body>
</html>

Nach dem Login kopieren

Das Obige ist eine vollständige Einführung in die Verwendung von CSS, um eine vertikale Textanordnung zu erreichen. Wenn Sie mehr über das CSS3-Tutorial Bitte achten Sie auf die chinesische PHP-Website.

Das obige ist der detaillierte Inhalt vonSo realisieren Sie die vertikale Anordnung von Text mithilfe von CSS. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!