Bolehkah Jarak Huruf dalam Div Dilaraskan Secara Dinamik untuk Mengisi Lebar Tetapnya?

Melaraskan Jarak Huruf agar Sesuai dengan Lebar Div

Masalah:

Anda mempunyai div dengan lebar tetap, dan teks di dalam div berbeza-beza panjangnya. Adakah mungkin untuk melaraskan jarak antara huruf dalam teks secara dinamik supaya ia sentiasa mengisi div dengan sempurna, tanpa mengira kandungan teks?

Penyelesaian:

Kuncinya untuk mencapai ini ialah menggabungkan sifat penjajaran teks CSS dan "godam" yang bijak.

CSS Kod:

div {
  background-color: gold;
  text-align: justify;
}

span {
  background-color: red;
  width: 100%;
  height: 1em;
  display: inline-block;
}

Kod HTML:

<div>
  Lorem ipsum sit dolor
  <span></span>
</div>

Penjelasan:

"teks- align: justify" sifat menjajarkan siram teks terhadap kedua-dua jidar kiri dan kanan. Elemen "span" ialah tindanan lutsinar yang meregangkan lebar div (100%). Dengan meletakkan "span" selepas kandungan teks, ia memaksa teks untuk mengisi ruang yang tinggal, membenarkan jarak antara huruf.

Atas ialah kandungan terperinci Bolehkah Jarak Huruf dalam Div Dilaraskan Secara Dinamik untuk Mengisi Lebar Tetapnya?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!