نصائح لتحقيق التفاف الأسطر تلقائيًا عند إنشاء صفحات ويب CSS
الكاتب：Eve Cole
وقت التحديث：2025-01-15 17:00:16
نصائح لتحقيق التفاف الأسطر تلقائيًا عند إنشاء صفحات ويب CSS الجمعة، 6 مارس، 2009 10:47 يعلم الجميع أن اللغة الإنجليزية المستمرة أو الأرقام يمكن أن تجعل الحاوية تتوسع ولا يمكن أن تلتف تلقائيًا وفقًا لحجم الحاوية، وإليك كيفية تغليفها باستخدام طريقة CSS!
بالنسبة إلى div 1. (متصفح IE)، المسافة البيضاء: عادية، فاصل الكلمات: كسر الكل؛ #wrap{مسافة بيضاء: عرض عادي: 200 بكسل }
أو
#wrap{word-break:break-all;width:200px;}على سبيل المثال.<div id="wrap">ddd1111111111111111111111111</div>التأثير: يمكن تحقيق التفاف الخط 2. (متصفح Firefox) White-space:normal; word -break:break-all;overflow:hidden; وبالمثل، لا توجد طريقة تنفيذ جيدة في FF، يمكنك فقط إخفاء أشرطة التمرير أو إضافتها. #wrap{مسافة بيضاء: عرض عادي: 200 بكسل؛}
أو
#wrap{word-break:break-all;width:200px; overflow:auto; }على سبيل المثال.<div id="wrap">ddd11111111111111111111111111111</div> التأثير: الحاوية عادية والمحتوى مخفي للجدول 1. (متصفح IE) استخدم نمط تخطيط الجدول: ثابت؛
على سبيل المثال.<نمط>
.tb{تخطيط الجدول: ثابت}
</style><table class="tbl" width="80">
<تر>
<td>abcdefghigklmnopqrstuvwxyz 1234567890
</TD>
</tr>
</table>التأثير: يمكن التفاف الأسطر 2. (متصفح IE) استخدم نمط تخطيط الجدول: ثابت وnowrapeg.<style>
.tb {تخطيط الجدول: ثابت}
</style><table class="tb" width="80">
<تر>
<td nowrap>abcdefghigklmnopqrstuvwxyz 1234567890
</TD>
</tr>
</table>التأثير: يمكن أن يلتف 3. (متصفح IE) استخدم نمط جدول التخطيط: ثابت وnowrap<style> عند استخدام النسبة المئوية لإصلاح حجم td http://www.knowsky.com/
.tb{تخطيط الجدول: ثابت}
</style><table class="tb" width=80>
<تر>
<عرض td=25% nowrap>abcdefghigklmnopqrstuvwxyz 1234567890
</TD>
<td nowrap>abcdefghigklmnopqrstuvwxyz 1234567890
</TD>
</tr>
</table> التأثير: يلتف كلا tds بشكل طبيعي 3. (متصفح Firefox) عند استخدام النسبة المئوية لإصلاح حجم td، استخدم تخطيط جدول الأنماط: ثابت وnowrap، واستخدم Diveg.<style>
.tb {تخطيط الجدول: ثابت}
.td {التجاوز: مخفي؛}
</style><table class=tb width=80>
<تر>
<عرض td=25% فئة=td nowrap>
<div>abcdefghigklmnopqrstuvwxyz 1234567890</div>
</TD>
<فئة td=td nowrap>
<div>abcdefghigklmnopqrstuvwxyz 1234567890</div>
</TD>
</tr>
</table> يجب تحديد عرض الخلية هنا بالنسبة المئوية. التأثير هو: عرض عادي، ولكن بدون التفاف الأسطر (ملاحظة: لا توجد طريقة جيدة لالتفاف محتوى الحاوية ضمن FF. يمكنك فقط استخدام التجاوز لإخفاء الإضافات. المحتوى لتجنب التأثير على التأثير الكلي)
