Bagaimana Saya Boleh Menghalang Kata-kata Panjang daripada Memecahkan Div Saya?

Menghalang Kata-kata Panjang daripada Memecah Div Anda

Dalam peralihan daripada susun atur jadual kepada susun atur div, satu isu kekal berterusan: perkara yang tidak diingini lanjutan perkataan yang terlalu panjang melepasi sempadan lajur div. Kejadian ini boleh menjejaskan estetika dan profesionalisme tapak web, seperti yang sering disaksikan walaupun di tapak yang terkenal, terutamanya yang memaparkan bahasa dengan istilah yang sangat panjang.

Penyelesaian 1: Tanda Sempang Lembut

Memasukkan tanda sempang lembut (&malu;) dalam perkataan panjang membolehkan pelayar menentukan rehat yang sesuai mata:

averyvery­longword

Ini menghasilkan pemaparan sebagai:

averyverylongword

atau

averyvery-
longword

Penyelesaian 2: Elemen

Sebagai alternatif, elemen boleh digunakan untuk menunjukkan potensi titik putus tanpa memperkenalkan sempang:

averyvery<wbr>longword

Ini memecahkan perkataan dengan bersih pada titik putus:

averyvery
longword

Penyelesaian 3: Sempang CSS (Tidak disokong oleh Chrome)

Sempang CSS (didayakan oleh sempang: auto;) kata sempang secara automatik berdasarkan kamus. Walaupun ia boleh meningkatkan penampilan teks yang dibenarkan, ia bukan penyelesaian yang boleh dipercayai untuk menghalang perkataan panjang daripada melebihi sempadan div.

Penyelesaian Retrospektif: paparan: sel jadual

Walaupun penamatannya untuk tujuan susun atur, paparan: table-cell; sifat masih boleh digunakan pada elemen lain, meniru gelagat regangan sel jadual, yang berkembang secara dinamik untuk menampung perkataan yang panjang.

Atas ialah kandungan terperinci Bagaimana Saya Boleh Menghalang Kata-kata Panjang daripada Memecahkan Div Saya?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!