Bagaimanakah Saya Boleh Mengendalikan Teks Melimpah dalam HTML Select Dropdown?-tutorial css-php.cn

How Can I Handle Overflowing Text in HTML Select Dropdowns?

Elipsis untuk Teks Limpahan dalam Kotak Jatuh Turun

Dalam bidang pembangunan web, mengurus teks limpahan dalam kotak lungsur turun boleh menjadi isu yang berterusan. Walaupun sifat text-overflow:ellipsis biasanya digunakan untuk memotong teks dalam elemen lain seperti div, ia telah menjadi masalah untuk dilaksanakan untuk elemen. Ini bermakna penyemak imbas secara automatik akan memotong mana-mana teks pilihan yang melebihi lebar kotak lungsur turun dan menambahkan elips untuk menunjukkan bahawa teks itu dipotong.

Penyelesaian Ganti

Sebelum kemas kini terbaharu ini, terdapat pilihan terhad untuk memotong teks dalam elemen tanpa menggunakan JavaScript. Satu penyelesaian yang terlibat menggunakan sifat overflow:hidden dan white-space:nowrap bersama-sama dengan text-overflow:ellipsis. Malangnya, pendekatan ini tidak berfungsi secara konsisten merentas semua penyemak imbas.

Alternatif lain ialah menggunakan perpustakaan ganti yang boleh disesuaikan seperti Chosen. Pustaka ini menyediakan menu lungsur yang boleh digayakan dan disesuaikan untuk memenuhi keperluan khusus di luar keupayaan kawalan borang HTML asli.

Pembangunan Masa Depan dan Pelaporan Pepijat

Walaupun Chrome telah menurap cara untuk pengendalian limpahan teks yang lebih baik dalam elemen, adalah penting untuk ambil perhatian bahawa pelayar lain mungkin tidak mengikutinya dengan serta-merta. Jika kekurangan sokongan yang konsisten mengganggu anda, anda mempunyai dua pilihan:

Failkan laporan pepijat terhadap sistem pengendalian atau penyemak imbas masing-masing, menyokong penggunaan text-overflow:ellipsis untuk