Mengapa Ellipsis Limpahan Teks CSS Saya Tidak Berfungsi?

Elipsis Tidak Muncul dalam CSS? Semak Keperluan Ini

Dalam CSS, limpahan teks: elipsis; ialah sifat berguna untuk memotong teks panjang dan menambah elipsis (...) apabila ruang terhad. Walau bagaimanapun, jika sifat ini tidak berfungsi seperti yang diharapkan, mungkin terdapat isu asas.

Syarat untuk Ellipsis Berfungsi:

text-overflow: elipsis; beroperasi dengan berkesan hanya apabila syarat tertentu dipenuhi:

• Lebar Terkekang: Lebar elemen mesti dikekang dalam piksel (px). Menggunakan peratusan (%) untuk lebar tidak akan mencetuskan elipsis.
• Limpahan: Gaya limpahan elemen mesti ditetapkan kepada tersembunyi.
• Pengurusan Ruang Putih: Sifat ruang putih elemen mesti ditetapkan kepada nowrap.

Isu Potensi:

Jika limpahan teks: elipsis; tidak berfungsi, isu yang paling mungkin ialah lebar elemen tidak dikekang dengan betul. Secara lalai, elemen dengan paparan: sebaris mengabaikan tetapan lebar.

Penyelesaian:

Untuk menyelesaikan isu, anda boleh mengubah suai gaya elemen dengan cara berikut:

• Paparan: Tukar paparan: sebaris kepada paparan: blok sebaris atau paparan: blok.
• Bekas Mengekang: Tambah elemen bekas dengan lebar tetap atau lebar maksimum dan tetapkan paparan elemen untuk menyekat.
• Terapung: Tetapkan elemen untuk terapung: kiri atau terapung: betul.

Contoh dengan Paparan Inline-Block:

Untuk menggambarkan, berikut ialah coretan kod yang disemak dengan paparan: sifat blok sebaris ditambah:

.app a {
  display: inline-block;
}

Dengan mengekang lebar elemen secara eksplisit, kesan elipsis kini sepatutnya berfungsi seperti yang dimaksudkan.

Atas ialah kandungan terperinci Mengapa Ellipsis Limpahan Teks CSS Saya Tidak Berfungsi?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!