Bagaimana untuk Mencegah Pecah Baris dalam Item Senarai?

Mencegah Pemecahan Baris dalam Item Senarai

Apabila bekerja dengan item senarai, ada kemungkinan untuk menghadapi keadaan di mana pemisah baris berlaku dalam teks, berpotensi memecahkan frasa penting seperti "Serahkan resume." Ini boleh menjadi tidak menarik secara visual dan mengganggu pengalaman pengguna.

Penyelesaian CSS untuk Mencegah Pecah Talian:

Untuk mengelakkan pemisah baris dalam item senarai, sifat ruang putih boleh digunakan pada tag li. Menetapkannya kepada nowrap dengan berkesan menghalang penyemak imbas daripada membungkus teks dalam elemen itu kepada berbilang baris. Ini memastikan bahawa teks kekal pada satu baris.

li {
  white-space: nowrap;
}

Ruang Tambahan:

Sebagai alternatif, jika dikehendaki, lebih banyak ruang boleh diperuntukkan kepada pautan dengan meningkatkan lebar unsur li. Dengan menetapkan lebar li kepada nilai yang lebih besar daripada lebar semasa, teks akan mempunyai ruang yang mencukupi untuk kekal pada satu baris tanpa membalut.

li {
  width: 200px;
}

Dengan memanfaatkan sama ada ruang putih: nowrap; atau meningkatkan lebar li, anda boleh menghalang pautan "Serahkan resume" daripada membungkus dan mengekalkan penampilan visual yang diingini dalam menu.

Atas ialah kandungan terperinci Bagaimana untuk Mencegah Pecah Baris dalam Item Senarai?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!