قواعد خاصية float في لغة CSS. | تعويم العناصر عن طريق خاصية float في لغة CSS

content إذا كان هناك container حاوية مساحتة عرضها 100% من صفحة الويب فإن خاصية float لا تحدث تأثير واضح إلا إذا تم إستخدام float مع العناصر الداخلية فسوف يحدث عن ذلك تأثير واضح وهو تغيير إتجاه المحتوي الداخلية للحاوية.
3d سوف تُصف العناصر الداخلية للحاوية الناتج عن إستخدام خاصية float عكسي خاصية float مع القيمة left سوف ينتج [Home - Profile - Contact ] وخاصية float مع القيمة right سوف ينتج [ Contact - Profile - Home].
display إستخدام خاصية float مع أي قيمة left أو right سوف ينتج عنها تتحويل عرض جميع العناصر من النوع display block إلي طريقة عرض مختلفة display inline-block.

لا يحدث تأثير واضح عن طريق خاصية float في لغة CSS في حال أن الحاويه 100% وعدم إستخدام flaot مع العناصر الداخلية للحاويه.

HTML

div
{
  width:100%;
  float: right;
  border:dashed 2px blue;
}

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

HTML

span
{
float:right;
border:red solid 1px;
padding:5px;
}

تغيير طريقة عرض العناصر من display block إلي display inline-block عن طريق خاصية float في لغة CSS.

HTML

div
{
  float: left;
  padding: 15px; 
  border:dashed blue 2px;
  margin-left:5px;
}

CSS Float rules قواعد خاصية float في لغة CSS.