Bagaimana untuk Membetulkan Lebar Elemen Span dan Menjajarkan Teks dalam Senarai Tidak Tertib dengan CSS?

Penjajaran Span Lebar Tetap CSS

Dilema biasa dalam CSS timbul apabila cuba membetulkan lebar teks dalam elemen span, terutamanya apabila tertanam dalam senarai tidak tersusun. Matlamatnya ialah untuk menjajarkan teks selepas rentang untuk mencipta persembahan visual yang lebih bersih.

Untuk mencapai matlamat ini, penyelesaian CSS mudah melibatkan penugasan elemen span dengan sifat berikut:

span {
  display: inline-block;
  width: 50px;
}

Pendekatan ini memanfaatkan paparan: sifat blok sebaris, yang mengarahkan rentang untuk berkelakuan seperti elemen sebaris dan blok. Dengan menentukan lebar 50px, rentang akan mempunyai lebar tetap, tanpa mengira kandungannya.

Walaupun penyelesaian ini berfungsi dengan berkesan dalam kebanyakan penyemak imbas moden, Firefox 2 dan versi terdahulu tidak menyokong sifat blok sebaris. Dalam kes sedemikian, sifat -moz-inline-box boleh digunakan sebagai alternatif. Walau bagaimanapun, adalah penting untuk ambil perhatian bahawa -moz-inline-box berkelakuan berbeza sedikit daripada inline-block dan mungkin tidak dipaparkan secara konsisten dalam semua situasi.

Atas ialah kandungan terperinci Bagaimana untuk Membetulkan Lebar Elemen Span dan Menjajarkan Teks dalam Senarai Tidak Tertib dengan CSS?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!