Rumah >hujung hadapan web >tutorial css >Bagaimanakah Saya Boleh Mewajarkan Baris Terakhir Teks dalam Div?

Bagaimanakah Saya Boleh Mewajarkan Baris Terakhir Teks dalam Div?

Susan Sarandon
Susan Sarandonasal
2024-12-16 16:44:13202semak imbas

How Can I Justify the Last Line of Text in a Div?

Menjajarkan Baris Terakhir Div dengan Teks Diwajarkan

Dalam senario tertentu, adalah perlu untuk menjajarkan baris terakhir div dengan teks yang dibenarkan. Walaupun ini biasanya bukan gelagat standard untuk div, kaedah penyemak imbas silang boleh mencapai kesan yang diingini ini.

Pelaksanaan memerlukan gabungan text-align-last: justify; dan variasi kaedah pseudo-kandungan :selepas. Gabungan CSS berjaya menangani keserasian penyemak imbas, termasuk IE6 .

Untuk menggunakan kaedah ini:

CSS:

p, h1 {
  text-align: justify;
  text-align-last: justify;
}

p:after, h1:after {
  content: "";
  display: inline-block;
  width: 100%;
}

Nota: Jika div anda mengandungi hanya satu baris teks, CSS tambahan diperlukan untuk menghalang baris kosong tambahan daripada muncul:

h1 {
  text-align: justify;
  text-align-last: justify;
  height: 1em;
  line-height: 1;
}

h1:after {
  content: "";
  display: inline-block;
  width: 100%;
}

Teknik ini berjaya memastikan bahawa baris terakhir div sejajar dengan teks yang dibenarkan, memberikan lebih fleksibiliti dalam pemformatan teks untuk pelbagai keperluan reka bentuk web.

Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Mewajarkan Baris Terakhir Teks 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