لكن

الأرقام المستمرة والأحرف الإنجليزية غالبًا ما تعمل على توسيع الحاوية، وهو أمر مزعج للغاية فيما يلي كيفية تنفيذ CSS لالتفاف الأسطر

.

تخطيط الجدول: ثابت؛ فاصل الكلمات: كسر الكل؛
هنا الفائض: مخفي أو تلقائي؛
================================================================================================== ==============

بالنسبة للعناصر على مستوى الكتلة مثل div وp، فإن التفاف سطر عناصر النص العادي (النص الآسيوي والنص غير الآسيوي) له مسافة بيضاء افتراضية: عادي، وسيتم التفافه تلقائيًا بعد العرض المحدد.
أتش تي أم أل

1. (متصفح IE) للأحرف الإنجليزية المستمرة والأرقام العربية، استخدم word-wrap:break-word; كسر

#wrap{word-break:break-all width:200px;}
أو
#wrap{word-wrap:break-word; width:200px;}

التأثير: يمكن تحقيق فواصل الأسطر

2. (متصفح Firefox) كسر الأحرف الإنجليزية المستمرة والأرقام العربية جميع إصدارات Firefox لا تحل هذه المشكلة، يمكننا فقط إخفاء الأحرف خارج الحدود أو إضافة أشرطة التمرير إلى الحاوية.

#wrap{word-break:break-all; width:200px; overflow:auto;}

التأثير: الحاوية عادية والمحتوى مخفي

للجدول
http://www.knowsky.com/
1. (متصفح IE) استخدم table-layout:fixed لفرض عرض الجدول وإخفاء المحتوى الزائد

التأثير: إخفاء المحتوى الزائد

2. (متصفح IE) استخدم تخطيط الجدول: ثابت لفرض عرض الجدول، يستخدم td الداخلي فاصل الكلمات: كسر الكل أو التفاف الكلمات: فاصل -كلمة؛ فاصل أسطر

<عرض الجدول = "200" نمط = "تخطيط الجدول: ثابت؛">
<تر>
abcdefghigklmnopqrstuvwxyz 1234567890

abcdefghigklmnopqrstuvwxyz 1234567890

التأثير: التفاف الخط ممكن

3. (متصفح IE) تداخل divs و p وما إلى ذلك في td، يستخدم طريقة التفاف الخط div و p المذكورة أعلاه

4. (متصفح Firefox) استخدم تخطيط الجدول: ثابت ؛ لفرض عرض الجدول، يستخدم td الداخلي فاصل الكلمات: كسر الكل أو التفاف الكلمات: كسر الكلمة؛ لا يعمل هنا

<نمط الجدول = "تخطيط الجدول: ثابت" العرض = "200">
<تر>
abcdefghigklmnopqrstuvwxyz1234567890
abcdefghigklmnopqrstuvwxyz1234567890

التأثير: إخفاء أكثر من محتوى

5. (متصفح Firefox) Nest div، p، إلخ في td، th. استخدم الطريقة المذكورة أعلاه للتعامل مع Firefox لتشغيل مربع التعليمات البرمجية، أخيرًا، فرصة حدوث هذه الظاهرة حدوثها صغير جدًا، ولكن لا يمكن استبعاد المزح من قبل مستخدمي الإنترنت.

ما يلي هو تأثير المثال المذكور

http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional. دي تي دي ">
http://www.w3.org/1999/xhtml ">
<الرأس>


<نمط النوع = "نص/CSS">
جدول، td، th، div { الحدود: 1 بكسل أخضر صلب؛}
الكود { عائلة الخط: "Courier New"، Courier، monospace؛}


<الجسم>

div

كل المسافات البيضاء:عادية;

IE word-wrap :break-word ;

IE فاصل الكلمات:فاصل الكل;

فايرفوكس/ word-break:break-all; ح1>

abcdefghijklmnabcdefghijklmnabcdefghijklmn111111111

الجدول

تخطيط الجدول:ثابت;

<نمط الجدول = "تخطيط الجدول: ثابت" العرض = "200">
<تر>
abcdefghigklmnopqrstuvwxyz1234567890ssssssssssssss

تخطيط الجدول: ثابت؛ فاصل الكلمات: التفاف الكل؛

<عرض الجدول = "200" نمط = "تخطيط الجدول: ثابت؛">
<تر>
abcdefghigklmnopqrstuvwxyz1234567890ssssssssssssss
abcdefghigklmnopqrstuvwxyz1234567890sssssssssssssss

FF table-layout:fixed:hidden;

<نمط الجدول = "تخطيط الجدول: ثابت" العرض = "200">
<تر>
abcdefghigklmnopqrstuvwxyz1234567890
abcdefghigklmnopqrstuvwxyz1234567890