ویژگی float در CSS
ویژگی float، یک المان را از موقعیت خود جدا و به صورت شناور، در المان والد نمایش می دهد.
مقادیری که ویژگی float می‌تواند بپذیرد شامل:
- right: المان به سمت راست، شناور می شود.
- left: المان به سمت چپ، شناور می شود.
- none: المان از حالت شناور، خارج می شود. (پیش فرض)
است.
دو کادر قرمز زیر به سمت راست و چپ شناور شده اند.
float: left
float: right
مقدار right ویژگی float در CSS
با مقدار right، می توان المان را در سمت راست والد خود شناور کرد.
لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ، و با استفاده از طراحان گرافیک است، چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است، و برای شرایط فعلی تکنولوژی مورد نیاز، و کاربردهای متنوع با هدف بهبود ابزارهای کاربردی می باشد، کتابهای زیادی در شصت و سه درصد گذشته حال و آینده، شناخت فراوان جامعه و متخصصان را می طلبد.
نکته: زمانی که یک المان را شناور می کنیم، المان ها و محتوای متنی والد آن، در کنار المان شناور شده، نمایش داده می شوند.
float: right;مقدار left ویژگی float در CSS
با مقدار left، می توان المان را در سمت چپ والد خود شناور کرد.
لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ، و با استفاده از طراحان گرافیک است، چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است، و برای شرایط فعلی تکنولوژی مورد نیاز، و کاربردهای متنوع با هدف بهبود ابزارهای کاربردی می باشد، کتابهای زیادی در شصت و سه درصد گذشته حال و آینده، شناخت فراوان جامعه و متخصصان را می طلبد.
نکته: زمانی که یک المان را شناور می کنیم، المان ها و محتوای متنی والد آن، در کنار المان شناور شده، نمایش داده می شوند.
float: left;مقدار none ویژگی float در CSS
با مقدار none، المان را از حالت شناور، خارج می کنیم. این مقدار، مقدار پیش فرض float است.
لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ، و با استفاده از طراحان گرافیک است، چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است، و برای شرایط فعلی تکنولوژی مورد نیاز، و کاربردهای متنوع با هدف بهبود ابزارهای کاربردی می باشد، کتابهای زیادی در شصت و سه درصد گذشته حال و آینده، شناخت فراوان جامعه و متخصصان را می طلبد.float: none;کاربرد های float در CSS
با کمک ویژگی float می توان:
- برای جدا کردن و قرار دادن یک المان در راست یا چپ والد (مشاهده مثال)
- برای قرار دادن متن و تصویر در کنار هم (مشاهده مثال)
- و برای در کنار هم قرار دادن المان هایی مانند دکمه ها، تصاویر و ...
استفاده کرد.
دکمه اول
دکمه دوم
دکمه سوم
float: right;خلاصه درس
در این درس با ویژگی float در CSS:
- مقدار right
- مقدار left
- مقدار none
- کاربرد های float
آشنا شدیم.
توسعه دهندگان
احسان اسلامی
