و float تحدد الخاصية أم لا عنصر يجب أن تطفو.
و clear ويستخدم خاصية للتحكم في سلوك العناصر العائمة.
خاصية الطفو
في أبسط استخدامه، و float الملكية يمكن أن تستخدم لالتفاف النص حول الصور.
يحدد المثال التالي صورة يجب أن تطفو على الحق في النص:
و clear الملكية
و clear ويستخدم خاصية للتحكم في سلوك العناصر العائمة.
سوف العناصر بعد العنصر العائمة تتدفق من حوله. لتجنب هذا، استخدم clear الممتلكات.
و clear تحدد الخاصية التي لا يسمح الجانبين عنصر العناصر العائمة لتعويم:
و clearfix Hack - overflow: auto;
إذا كان العنصر هو أطول من عنصر يحتوي على ذلك، وطرح ذلك، فإنه سيتم تجاوز خارج الحاوية الخاصة به.
ثم يمكننا أن نضيف overflow: auto; إلى عنصر يحتوي على إصلاح هذه المشكلة:
تخطيط ويب مثال
ومن الشائع أن تفعل تخطيطات بأكملها على شبكة الإنترنت باستخدام float الملكية:
مثال
div {
border: 3px solid blue;
}
.clearfix {
overflow: auto;
}
nav {
float: left;
width: 200px;
border: 3px solid #73AD21;
}
section {
margin-left: 206px;
border: 3px solid red;
} انها محاولة لنفسك » 
المزيد من الأمثلة
صورة مع الحدود والهوامش التي تعوم إلى الحق في فقرة
السماح لتعويم الصورة الى اليمين في فقرة. إضافة الحدود والهوامش إلى الصورة.
صورة مع التعليق أن يطفو إلى اليمين
دعونا صورة مع تعويم تسمية توضيحية إلى اليمين.
دع الحرف الأول من تعويم فقرة إلى اليسار
دع الحرف الأول من تعويم فقرة إلى اليسار وأسلوب الرسالة.
إنشاء قائمة أفقية
استخدام تعويم مع قائمة وصلات لإنشاء القائمة الأفقية.
إنشاء صفحة رئيسية دون الجداول
استخدام تطفو إلى إنشاء صفحة خاصة مع رأس وتذييل محتوى اليسار والمحتوى الرئيسي.
جميع خصائص CSS تعويم
| الملكية | وصف |
|---|---|
| clear | يحدد على أي من جانبي عنصر حيث لا يسمح للعناصر العائمة لتعويم |
| float | تحدد ما إذا كان عنصر يجب أن تطفو |
| overflow | يحدد ماذا يحدث إذا كان المحتوى تجاوزات مربع عنصر ل |
| overflow-x | يحدد ما يجب القيام به مع اليسار حواف / يمين المحتوى إذا كان يفيض مجال المحتوى على العنصر |
| overflow-y | يحدد ما يجب القيام به مع الحواف العلوية / السفلية من المحتوى إذا كان يفيض مجال المحتوى على العنصر |