Rumah > hujung hadapan web > tutorial css > Bagaimanakah Saya Boleh Menghalang Perkataan Panjang daripada Melimpah dalam DIV?

Bagaimanakah Saya Boleh Menghalang Perkataan Panjang daripada Melimpah dalam DIV?

Susan Sarandon
Lepaskan: 2024-12-16 19:42:17
asal
986 orang telah melayarinya

How Can I Prevent Long Words from Overflowing in a DIV?

Mengatasi Limpahan Kata Panjang dalam DIV

Satu cabaran biasa yang dihadapi apabila bekerja dengan elemen DIV ialah teks yang melebihi lebar DIV, mengakibatkan kandungan melimpah di luar bekas . Ini amat ketara apabila berurusan dengan perkataan yang terlalu panjang.

Untuk menangani isu ini dan memastikan teks sesuai dengan sempurna dalam sempadan DIV, CSS menawarkan penyelesaian:

Menggunakan limpahan-bungkus: break- perkataan;

Dengan menetapkan sifat overflow-wrap kepada kata putus, penyemak imbas akan memecahkan perkataan secara automatik pada titik yang sesuai untuk dimuatkan dalam lebar DIV yang ditentukan. Ini memastikan keseluruhan teks kelihatan tanpa melimpah.

div {
  overflow-wrap: break-word;
}
Salin selepas log masuk

Contoh:

<div>
Salin selepas log masuk

Menggunakan limpahan-bungkus: break-word; akan memaksa penyemak imbas untuk memuatkan semua teks dalam lebar DIV yang ditentukan, memecahkan perkataan panjang jika perlu.

Nota: Untuk keserasian dengan pelayar lama seperti IE6, anda boleh menggunakan yang tidak digunakan harta bungkus perkataan: kata putus. Walau bagaimanapun, adalah disyorkan untuk menggunakan harta overflow-wrap moden sebagai ganti.

Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Menghalang Perkataan Panjang daripada Melimpah dalam DIV?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Artikel terbaru oleh pengarang
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan