css

صفت float در CSS – آموزش CSS

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


برای این صفت دو ویژگی تعریف شده است. ویژگی اول Left به معنای چپ و ویژگی دوم Right به معنای راست می باشد. به مثال زیر توجه کنید:

در HTML :

<!DOCTYPE html>
 <html lang="en">
 <head>
     <meta charset="UTF-8">
     <link rel="stylesheet" href="test.css">
     <title>test</title>
 </head>
 <body>

<img src=”css.png” width=”100px” height=”100px”>
<p class=”p1”>این متن شماره ی یک میباشد.</p>
<p>این متن شماره ی دو میباشد.</p>

</body>
</html>

در CSS :

img{
     float: left;
 }.p1{
     float: right;
 }

 

این متن شماره ی یک میباشد.

این متن شماره ی دو میباشد.

در این جا ما به عکسمون float با ویژگی Left را داده ایم و همچنین برای متن اول نیز از float:right استفاده کرده ایم. همین طور که می بینید عکس در سمت چپ صفحه و متن اول در قسمت راست صفحه قرار گرفته اند.css

ویژگی دیگری نیز این صفت دارد که می توان از آن هم در مواقعی استفاده کرد.none صفتی است که اگر بخش مورد نظر float از قبل گرفته باشد، می توان آن صفت را از بین برد.

این صفت کاربرد زیادی در برنامه نویسی دارد. ولی یکی از کم بود های این صفت می توان به نداشتن ویژگی center اشاره کرد. هر چند برای این که بخش مورد نظر در وسط قرار گیرد صفات دیگری چون text-aling و margin وجود دارد.

Related Articles

دیدگاهتان را بنویسید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

این مطلب را از دست ندهید!

Close
Close