درک ویژگی CSS Clear

CSS ملک روشن CSS1 بخشی از CSS است. این به شما اجازه می دهد مشخص کنید که چه عناصر می تواند در کنار عنصر پاک شده و در طرفین (ها) شناور باشد. دارایی روشن دارای پنج مقدار ممکن است:

نحوه استفاده از ویژگی CSS روشن

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

متن کنار تصویر من

متن زیر تصویر من است

کلیه عناصر به طور پیش فرض برای پاک کردن: none؛ ، بنابراین اگر شما عناصر دیگر را در کنار چیزی شناور نیستید، باید سبک روشن را تغییر دهید.

هنگامی که شما شناورها را پاکسازی می کنید، مشخصه خود را به شناور خود می بینید. بنابراین اگر عنصر را به سمت چپ ببرید، باید به سمت چپ روشن کنید. عنصر شناور شما همچنان به شناور ادامه خواهد داد، اما عنصر پاک شده و همه چیز بعد از آن در زیر صفحه آن ظاهر خواهد شد.

اگر عناصری را که به سمت راست و چپ شناور شده اند، می توانید فقط یک طرف را پاک کنید و یا می توانید هر دو را پاک کنید.

با استفاده از روشن در پوسته ها

شایع ترین روش استفاده بیشتر از طراحان از ویژگی های روشن در طرح بندی عناصر صفحه است . شما ممکن است یک تصویر را در داخل یک بلوک متن بکشید و بخواهید پاراگراف بعدی زیر تصویر را شروع کنید یا ستون کامل متن را که می خواهید در کنار یک دسته دیگر از متن بگردید، با برخی از متن های زیر ظاهر می شود.

در اینجا HTML برای طرح بندی در این فرم است.

این یک مخزن دیواری است که دارای دیگری است که به سمت چپ شناور است.



یک فروند شناور کوتاه



محتویات داخل ظرف div که در سمت راست div div قرار می گیرند.

این کار به خوبی انجام می شود، با کوچکتر شدن div به سمت چپ بقیه محتویات div main.

شما می توانید متن را در کنار جعبه شناور به سادگی با اضافه کردن یک برچسب که می خواهید آن را در زیر جعبه شناور شروع کنید.

اما مشکل زمانی رخ می دهد که جعبه شناور طولانی تر از محتویات آن است. سپس، همانطور که می بینید، رنگ پس زمینه جعبه اصلی به پایین جعبه شناور منتقل نمی شود.

خوشبختانه، یک راه آسان برای حل این وجود دارد: اموال. با تنظیم جعبه اصلی به سرریز: auto؛ رنگ پسزمینه در کنار جعبه شناور باقی مانده به پایین بسیار پایین، همانطور که در این مثال نشان داده شده است.