CSS

CSS Clear
خاصية clear في لغة CSS

سوف تتعلم في هذا الدرس عرض العناصر في صفوف جديدة وعدم تطبيق تسلسلها وصفها في الصفوف العلوية الناتج عن إستخدام خاصية float في لغة CSS.

التاريخ

18 نوفمبر 2022

الدروس

137

المستوى

مبتدئ

اللغة

انجليزي

المشاهدات

1118

المواضيع

24
الشروحات chevron_left CSS Clear chevron_left CSS
CSS Flex Box keyboard_arrow_down

CSS Clear
خاصية clear في لغة CSS

</> CSS Clear
خاصية clear في لغة CSS

تًستخدم خاصية celar في لغة CSS لتحدد ما إذا كان يجب نقل عنصر إلى أسفل أو صفه بجانب عناصر في نفس السطر  وهي العناصر التي تم تطبيق خاصية float التي تسبقه. وتعمل خاصية clear على العناصر التي تستخدم خاصية float والعناصر التي لا تستخدم خاصية float.


لماذا تُستخدم خاصية float في لغة CSS؟

  • لإلغاء إدراج (صف) او رص العنصر بجوار عناصر أخري في نفس السطر ليبدأ العنصر في سطر جديد.


قيم خاصية float في لغة CSS:

  • none الوضع الأفتراضي وهو يتم عرض العنصر بجوار العناصر الأخري في نفس السطر.
  • left تستخدم ليبدأ العنصر بالأسفل لتجاهل المساحه المتاحه له من جهة اليسار التي أتاحتها له خاصية float.
  • right تستخدم ليبدأ العنصر بالأسفل لتجاهل المساحه المتاحه له من الجهة اليمني التي أتاحتها له خاصية float.
  • both تستخدم ليبدأ العنصر بالأسفل لتجاهل المساحات المتاحه له من الجهتين اليمني واليسري التي أتاحتهما له خاصية float.
clear left

خاصية clear مع القيمة left مع خاصية float في لغة CSS.

float right

خاصية clear مع القيمة right مع خاصية float في لغة CSS.

CSS clear syntax

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

clear:value;
CSS clear values

قيم خاصية clear في لغة CSS.

clear:none|left|right|both|initial|inherit;

</> CSS clear none
خاصية float مع القيمة clear في لغة CSS

تُستخدم خاصية clear مع القيمة none لألغاء التأثير الناتج عن خاصية clear أو لعرض العناصر بوضعهم الأفتراضي علي حسب طريقة عرض العنصر الناتج عن خاصية float في لغة CSS وهي ان تُعرض العناصر بجوار بعضها لعبض إذا كانت لها مساحه في نفس السطر.

CSS clear none

خاصية float مع القيمة none في لغة CSS.

.clear
{
  clear:none;
}

</> CSS float left
خاصية float مع القيمة left في لغة CSS

تُستخدم خاصية clear مع القيمة left في لغة CSS بعرض العنصر في سطر جديد وتجاهل المساحة الناتجة عن إستخدام خاصية float لتعويم العناصر بجوار بعضها لبعض من جهة اليسار.

CSS clear left

خاصية clear مع القيمة left في لغة CSS.

.clear
{
  clear:left;
}

</> CSS float right
خاصية float مع القيمة right في لغة CSS

تُستخدم خاصية clear مع القيمة right في لغة CSS لعرض العنصر في سطر جديد وتجاهل المساحة الناتجة عن إستخدام خاصية float لتعويم العناصر بجوار بعضها لبعض من جهة اليمين.

CSS clear right

خاصية clear مع القيمة right في لغة CSS.

.clear
{
  clear:right;
}

</> CSS clear both
خاصية clear مع القيمة both في لغة CSS

تُستخدم خاصية clear مع القيمة right في لغة CSS لعرض العنصر في سطر جديد وتجاهل المساحة الناتجة عن إستخدام خاصية float لتعويم العناصر بجوار بعضها لبعض من الجهتين.

CSS clear both

خاصية clear مع القيمة both في لغة CSS.

.clear
{
  clear:both;
}
معلومات تهمك
  • لا تنسى تقييم الدروس لكي نُحدّث المُحتوى باستمرار حتى ينال إعجابك.
  • لا تنسى مشاركة الموقع مع أصدقاءك حتى تعمّ الفائدة وتكون سبب في نفعهم.
مشاركة
0
0
0
0
عدد المشاركات
هل هذه المعلومات نالت إعجابك ؟
0
0
عدد التقييمات

لديك استفسار ؟

يسعدنا كثيرا مساعدتك في استيعاب افضل للأمور, فلا تترد مطلقا في الاتصال بنا في حال كانت لديك اية اسئله او استفسارات.