خاصية word-wrap في لغة CSS

في هذا الدرس 3تصفّح المواضيع

CSS word wrap خاصية word-wrap في لغة CSS

تستخدم خاصية word-wrap في لغة CSS للتحكم في الكلمات الطويلة التي تخرج عن حدود العنصر تلتف إلي السطر التالي أو تظل في سطر واحد.

قيم خاصية word-wrap في لغة CSS:

normal هي القيمة الأفتراضية وهي أن الكلمات الطويلة تطفح خارج حدود العنصر ولا يتم كسرها.
break-word تسمح بتكسير الكلمات الغير قابلة للكسر وتلتف إلي السطر التالي.

طريقة كتابة خاصية word-wrap في لغة CSS.

HTML

word-wrap:value;

قيم خاصية word-wrap في لغة CSS.

HTML

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

تستخدم خاصية word-wrap في لغة CSS مع القيمة normal لتطفح الكلمات الطويلة خارج حدود العنصر ولا يتم كسرها وهي القيمة الأفتراضية.

جرّب بنفسك

خاصية word-wrap في لغة CSS مع القيمة normal.

HTML

p
{
  word-wrap: normal;
  background-color:#2196F3;
  color:white;
  width:100px;
  padding:10px;
}

تستخدم خاصية word-wrap في لغة CSS مع القيمة break-word لتسمح بتكسير الكلمات الغير قابلة للكسر وتلتف إلي السطر التالي.

جرّب بنفسك

خاصية word-wrap في لغة CSS مع القيمة break-word.

HTML

p
{
  word-wrap:break-word;
  background-color:#2196F3;
  color:white;
  width:100px;
  padding:10px;
}