Heim >Web-Frontend >CSS-Tutorial >So realisieren Sie die vertikale Anordnung von Text mithilfe von CSS
Der Inhalt dieses Artikels befasst sich mit der Verwendung von CSS zur Erzielung einer vertikalen Textanordnung. Freunde in Not können darauf verweisen.
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; }
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; }
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>
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!