Rumah >hujung hadapan web >tutorial css >Bagaimana untuk memusatkan teks menegak dalam css

Bagaimana untuk memusatkan teks menegak dalam css

WBOYasal: 2021-12-09 15:27:5410238semak imbas

Kaedah: 1. Gunakan atribut "writing-mode" untuk menetapkan paparan teks menegak, sintaksnya ialah "elemen teks {writing-mode:vertical-lr}" 2. Gunakan "text-align " atribut untuk menetapkan teks menegak untuk dipusatkan , sintaks "elemen teks {text-align:center}".

Persekitaran pengendalian tutorial ini: sistem Windows 10, versi CSS3&&HTML5, komputer Dell G3.

Cara memusatkan teks menegak dalam css

Dalam css, anda boleh menggunakan atribut mod penulisan untuk menetapkan paparan menegak teks, dan anda boleh menggunakan teks-align Property menetapkan teks untuk dipusatkan.

Atribut mod penulisan mentakrifkan cara teks dibentangkan secara mendatar atau menegak.

Contoh adalah seperti berikut:

<!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>

Hasil keluaran:

Bagaimana untuk memusatkan teks menegak dalam css

(Belajar perkongsian video: tutorial video css )

Atas ialah kandungan terperinci Bagaimana untuk memusatkan teks menegak dalam css. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

html5 css css3

Kenyataan：

Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn

Artikel sebelumnya：Bagaimana untuk menetapkan kedudukan relatif dan kedudukan mutlak dalam cssArtikel seterusnya：Bagaimana untuk menetapkan kedudukan relatif dan kedudukan mutlak dalam css

Artikel berkaitan

Lihat lagi