الخاصية word-break

من موسوعة حسوب
< CSS
اذهب إلى: تصفح، ابحث
الخاصية word-break في CSS تُحدِّد إذا كان على المتصفح الانتقال إلى سطر جديد ضمن الكلمات نفسها لمنع النص من تجاوز حدود صندوق المحتوى للعنصر الحاوي عليه. وعلى النقيض من الخاصية overflow-wrap، ستنتقل الخاصية word-break إلى سطرٍ جديد عند المكان الذي كان سيتجاوز النص فيه حدود صندوق المحتوى، حتى لو كان وضع الكلمة في سطرٍ بمفردها سيؤدي إلى عدم تجاوزها حدود صندوق المحتوى.
/* كلمات محجوزة */
word-break: normal; 
word-break: break-all; 
word-break: keep-all;

/* قيم عامة */
word-break: inherit;
word-break: initial;
word-break: unset;
القيمة الابتدائية normal
تُطبَّق على جميع العناصر.
قابلة للوراثة نعم
قابلة للتحريك لا
القيمة المحسوبة كما حُدِّدت.

أمثلة

مثال عن استخدام الكلمة المحجوزة normal و break-all على فقرتين، إحداهما بالألمانية (فيها كلمة طويلة جدًا)، والأخرى بالعربية (فيها أطول كلمة عربية):
<p class="normal">FStrPrivFinÄndG (Gesetz zur Änderung des Fernstraßenbauprivatfinanzierungsgesetzes und straßenverkehrsrechtlicher Vorschriften)</p>
<p class="break-all">FStrPrivFinÄndG (Gesetz zur Änderung des Fernstraßenbauprivatfinanzierungsgesetzes und straßenverkehrsrechtlicher Vorschriften)</p>

<p class="normal">أطول كلمة في اللغة العربية هي أفاستسقيناكموها</p>
<p class="break-all">أطول كلمة في اللغة العربية هي أفاستسقيناكموها</p>
شيفرة CSS:
.normal {
  width: 5em;
  border: 1px solid;
}

.break-all {
  width: 5em;
  border: 1px solid;
  word-break: break-all;
}
انظر إلى المثال في صفحة الخاصية overflow-wrap لتمييز الفرق بين الخاصيتين.

دعم المتصفحات

الميزة Chrome Firefox Internet Explorer Opera Safari
الدعم الأساسي 1.0 15.0 5.5 15 مدعومة
keep-all 44 15.0 5.5 31 9

متصفح Edge لا يدعم الكلمة المحجوزة keep-all.

البنية العامة

تقبل الخاصية word-break إحدى الكلمات المحجوزة التالية.

القيمة normal

سيتم الانتقال إلى سطرٍ جديد عند مواضع المحددة (مثل الفراغ بين الكلمتين).

القيمة break-all

يمكن الانتقال إلى سطر جديد بين أيّ حرفين تجنبًا لخروج النص من صندوق المحتوى.

القيمة keep-all

قيمة خاصة تُطبَّق على النصوص الصينية أو اليابانية أو الكورية، وإذا استعملناها على نصوص أخرى فلها أثر الكلمة المحجوزة normal.

البنية الرسمية

word-break: normal | break-all | keep-all;

مصادر ومواصفات