logo

كيفية التفاف النص في CSS؟

CSS التفاف الكلمة تُستخدم الخاصية لتقسيم الكلمات الطويلة والتفافها في السطر التالي. تُستخدم هذه الخاصية لمنع التجاوز عندما تكون السلسلة غير القابلة للكسر طويلة جدًا بحيث لا يمكن وضعها في المربع الذي يحتوي عليها.

تحدد هذه الخاصية الفواصل في الكلمة لتجنب التجاوز عندما تكون الكلمة طويلة جدًا بحيث لا يمكن احتواؤها في الحاوية. يحدد تقسيم الكلمات عندما يتجاوز المحتوى حدود الحاوية.

بناء الجملة

 word-wrap: normal | break-word | initial l inherit ; 

قيم

طبيعي: إنها القيمة الافتراضية التي يتم استخدامها لفصل الكلمات عند نقاط التوقف المسموح بها فقط.

كلمة فاصلة: يتم استخدامه لكسر الكلمات غير القابلة للكسر.

أولي: يتم استخدامه لتعيين الخاصية إلى قيمتها الافتراضية.

يرث: يرث الخاصية من العنصر الأصلي.

مثال

 .test { width: 200px; background-color: lightblue; border: 2px solid black; padding: 10px; font-size: 20px; } .test1 { width: 11em; background-color: lightblue; border: 2px solid black; padding: 10px; word-wrap: break-word; font-size: 20px; } <p> In this paragraph, there is a very long word: iamsooooooooooooooooooooooooooooooolongggggggggggggggg. The long word will break and wrap to the next line. </p> 
اختبره الآن

انتاج |

كيفية التفاف النص في CSS