خصائص float لـ CSS

  • الصفحة السابقة flex-wrap
  • الصفحة التالية font

وصف

تعريف والاستخدام

إذا تم تحريك عنصر غير بديل، يجب تحديد عرض واضح؛ وإلا ستكون عرضها ضيقة قدر الإمكان.

ملاحظة:إذا لم يكن هناك مساحة محدودة جدًا في السطر الواحد للعناصر المتحركة، فإن العنصر سيقفز إلى السطر التالي، وسيستمر هذا العمل حتى يكون هناك سطر يحتوي على مساحة كافية.

انظر أيضًا:

دليل CSS:توضيح CSS

دليل مرجعي لـ HTML DOM:خصائص cssFloat

مثال

تطبيق تحليل الصورة إلى اليمين:

img
  {
  float:right;
  }

جرب بنفسك

الجافا سكربت:

float: none|left|right|initial|inherit;

قيمة الخاصية

القيمة الوصف
اليسار العنصر يطفو إلى اليسار.
اليمين العنصر يطفو إلى اليمين.
لا شيء القيمة الافتراضية. العنصر لا يطفو ويظهر في الموضع الذي يظهر فيه في النص.
التوريث يُحدد هذا الخصائص أن القيمة يجب أن تُورث من عنصر الأب float.

تفاصيل التقنية

القيمة الافتراضية: لا شيء
التوريث: لا
الإصدار: CSS1
جافا سكربت: object.style.cssFloat="left"

مثال TIY

التطبيق البسيط لخصائص float
جعل الصورة تطفو على الجانب الأيمن لفقرة واحدة.
تطبيق حواف وحدود على الصورة المزودة بالحواف والحدود وتطبيقها على الجانب الأيمن للفقرة
جعل الصورة تطفو على الجانب الأيمن للفقرة. أضف حواف وحدود للصورة.
الصورة المزودة بالعنوان تطفو على الجانب الأيمن
جعل الصورة التي تحتوي على عنوان تطفو على الجانب الأيمن
جعل حرف البداية للفقرة يطفو على الجانب الأيسر
جعل حرف البداية للفقرة يطفو على الجانب الأيسر، وأضف له نمطًا.
إنشاء قائمة أفقية
استخدام التحليل مع رابط في عمود واحد لإنشاء قائمة أفقية.
إنشاء الصفحة الرئيسية بدون جدول
استخدام التحليل لإنشاء الصفحة الرئيسية مع رأس الصفحة وقدم الصفحة وملف الأدلة الجانبية والمحتوى الرئيسي.

دعم المتصفح

الرقم في الجدول يوضح إصدار المتصفح الأول الذي يدعم هذه الخاصية بالكامل.

Chrome IE / Edge Firefox Safari Opera
1.0 4.0 1.0 1.0 7.0
  • الصفحة السابقة flex-wrap
  • الصفحة التالية font