خانه » چیدمان عناصر توسط float در CSS

چیدمان عناصر توسط float در CSS

  • تاریخ :‌
  • دسته : ---
در این آموزش با خصوصیت معروفی به نام float در CSS آشنا می شویم.

خصوصیت float :
اگر تا به حال به مقالات یک روزنامه یا مجله دقت کرده باشید، شیوه چیدمان یک مقاله مانند تصویر زیر به این صورت است که تصاویر در جهت های مختلف (چپ و راست) چیده شده اند و محتوا قبل یا بعد از آنها به دور آنها جمع شده اند.

چیدمان عناصر در css

عبارت float به معنی شناور است و در صفحه وب برای عناصری به کار می رود که قرار است به سمت چپ یا راست شناور شوند و عناصر بعد از آن به دور لبه آن جمع شوند.

خصویت float دارای 4 مقدار می باشد :

none : مقدار پیشفرض همه عناصر می باشد که خصوصیت float را غیرفعال می کند.
right : عنصر مورد نظر را به سمت راست شناور می کند.
left : عنصر مورد نظر را به سمت چپ شناور می کند.
inherit : این مقدار تعیین می کند که باید مقدار خصوصیت float والد خود را به ارث ببرد.

float: none;
float: right;
float: left;
float: inherit;


مثال:
در مثال زیر تصویر و پاراگرافی را در نظر می گیریم که مقدار float برای تصویر در حالت پیشفرض none است و یعنی هیچ مقداری برای آن در نظر گرفته نشده است.

چیدمان عناصر در css

مقدار float  برای تصویر را برابر left قرار می دهیم تا به سمت چپ شناور شود

img {
float: left;
}


چیدمان عناصر در css

مطالب مشابه

ارسال نظر

عکس خوانده نمی‌شود





2018 © تمامی حقوق این وب‌سایت برای پیشروسافت محفوظ است.
انصراف
سوالی دارید؟ پاسخگو هستیم