CSS Word Wrap
خاصية word-wrap في لغة CSS
سوف تتعلم في هذا الدرس إلتفاف النصوص في لغة CSS والتحكم ليلتف النص الي سطور جديدة أو لا يلتف النص إلي سطور جديدة ويبقي في سطر واحد.
التاريخ
30 نوفمبر 2022
الدروس
137
المستوى
مبتدئ
اللغة
انجليزي
المشاهدات
1358
المواضيع
24
CSS Word Wrap
خاصية word-wrap في لغة CSS
</>
CSS word wrap
خاصية word-wrap في لغة CSS
تستخدم خاصية word-wrap في لغة CSS للتحكم في الكلمات الطويلة التي تخرج عن حدود العنصر تلتف إلي السطر التالي أو تظل في سطر واحد.
قيم خاصية word-wrap في لغة CSS:
- normal هي القيمة الأفتراضية وهي أن الكلمات الطويلة تطفح خارج حدود العنصر ولا يتم كسرها.
- break-word تسمح بتكسير الكلمات الغير قابلة للكسر وتلتف إلي السطر التالي.
CSS word-wrap Syntax
طريقة كتابة خاصية word-wrap في لغة CSS.
word-wrap:value;
CSS word-wrap Values
قيم خاصية word-wrap في لغة CSS.
word-wrap:normal|break-word|initial|inherit;
</>
CSS word wrap normal
خاصية word-wrap مع القيمة normal في لغة CSS
تستخدم خاصية word-wrap في لغة CSS مع القيمة normal لتطفح الكلمات الطويلة خارج حدود العنصر ولا يتم كسرها وهي القيمة الأفتراضية.
CSS word wrap normal
خاصية word-wrap في لغة CSS مع القيمة normal.
p { word-wrap: normal; background-color:#2196F3; color:white; width:100px; padding:10px; }
</>
CSS word wrap break word
خاصية word-wrap مع القيمة break-word في لغة CSS
تستخدم خاصية word-wrap في لغة CSS مع القيمة break-word لتسمح بتكسير الكلمات الغير قابلة للكسر وتلتف إلي السطر التالي.
CSS word wrap break word
خاصية word-wrap في لغة CSS مع القيمة break-word.
p { word-wrap:break-word; background-color:#2196F3; color:white; width:100px; padding:10px; }