خاصية word-break
آخر تحديث: 2026-09-13
word-break خاصية word-break
تتحكم خاصية word-break في CSS في كيفية كسر الكلمات عند حد الحاوية، وتحل أساسًا مشكلة تجاوز الكلمات الطويلة أو عناوين URL للحاوية. تقرر ما إذا كانت الكسرات مسموحة داخل الكلمات وكيف يُلفّ نص CJK. وهي مفيدة بشكل خاص للسلاسل الطويلة التي يدخلها المستخدم.
| الفئة | |
|---|---|
| القيمة الأولية | normal |
| موروث | نعم |
| ينطبق على | |
| نوع الحركة | |
| إصدار CSS | CSS3 |
| الحالة | قياسي |
📝 التركيب
word-break: normal | break-all | keep-all | break-word;⚙️ القيم
| القيمة | النوع | الوصف |
|---|---|---|
normal | break-all | keep-all | break-word | كلمة مفتاحية | قواعد كسر الكلمات |
▶ مثال
عدّل الكود أدناه وشاهد النتيجة المباشرة في الملعب:
🌐 دعم المتصفحات
| المتصفح |  Chrome |
 Edge |
 Firefox |
 Safari |
 Opera |
|---|---|---|---|---|---|
| word-break | ✓ v43 | ✓ v12 | ✓ v15 | ✓ v9 | ✓ v30 |
| مدعوم في جميع المتصفحات الرئيسية | |||||
تلميح： يسمح break-all بالكسر بين أي أحرف، ومناسب لعناوين URL والكود؛ بينما يحفظ keep-all كلمات CJK سليمة ويمنع الكسر بين الأحرف.
مهم： نُقلت قيمة break-word إلى خاصية overflow-wrap؛ ولا تزال تعمل في word-break لكنها صياغة قديمة — يُفضَّل overflow-wrap: break-word.
❓ الأسئلة الشائعة
Qما الفرق بين word-break وoverflow-wrap؟
Aيتحكم word-break في القواعد الخاصة بالكسر داخل الكلمات، بينما يتحكم overflow-wrap (سابقًا word-wrap) فيما إذا كانت الكلمة الطويلة التي لا تكسر مسموحًا كسرها. غالبًا ما يُدمجان: word-break: break-all يفرض الكسر، بينما overflow-wrap: break-word يحافظ على الكلمات سليمة عند الإمكان.
Qما قيمة word-break التي يجب استخدامها للنص الصيني في CSS؟
Aيعمل الافتراضي normal مع الصينية، إذ تُكسر الحروف الصينية أصلًا بين الأحرف. استخدم keep-all عندما لا تريد تقسيم الكلمات الإنجليزية في نص مختلط، واستخدم break-all فقط لعناوين URL أو الكلمات الطويلة التي تفيض الحاوية.
Qما الفرق بين break-all وbreak-word في CSS؟
Aيفرض break-all كسر السطر بين أي حرفين، قاطعًا الكلمات عند حد الحاوية؛ بينما يحافظ break-word (المنقول الآن إلى overflow-wrap) على الكلمات سليمة ما أمكن، ولا يكسر داخل الكلمة إلا عندما لا تتسع كلمة واحدة. الأول عدواني والثاني أكثر ودًا.
🏷️ خصائص ذات صلة
💡 حالات ذات صلة
📚 دروس ذات صلة
خاصية overflow-wrap
تتحكم في التفاف الكلمات الطويلة.
خاصية white-space
تتحكم في معالجة المسافات البيضاء والكسر.
