Rumah >hujung hadapan web >tutorial css >Bagaimana untuk Memusatkan Teks Secara Menegak Dalam DIV?

Bagaimana untuk Memusatkan Teks Secara Menegak Dalam DIV?

Mary-Kate Olsen
Mary-Kate Olsenasal
2024-12-21 00:11:141007semak imbas

How to Vertically Center Text Within a DIV?

Penjajaran Teks Menegak dalam DIV

Dalam usaha untuk memusatkan teks secara menegak dalam DIV, kod yang disediakan menghadapi halangan. Walaupun menggunakan atribut atas margin, penjajaran yang dikehendaki tetap sukar difahami. Untuk menangani perkara ini, pendekatan yang diperhalusi diperlukan.

Penyelesaian:

Kunci untuk mencapai penjajaran menegak terletak pada mengubah suai penggayaan CSS DIV. Gabungan teknik boleh digunakan, bergantung pada keperluan khusus dan kerumitan kandungan:

  • Untuk Satu Baris Teks:

Tetapkan sifat "line-height" DIV untuk sama dengan ketinggiannya. Ini mengarahkan penyemak imbas untuk memperuntukkan ruang yang sama di atas dan di bawah teks, dengan berkesan memusatkannya secara menegak.

Contoh:

div {
  height: 200px;
  line-height: 200px;
}
<div>Vertically Centered Text</div>

Atas ialah kandungan terperinci Bagaimana untuk Memusatkan Teks Secara Menegak Dalam DIV?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

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