CSS نمایش - شناور و پاک کردن
CSS نمایش - شناور و پاک کردن
CSS float این ویژگی مشخص میکند که عناصر چگونه باید سواری شوند.
CSS clear این ویژگی مشخص میکند که کدام عناصر میتوانند در کنار عناصر پاک شده قرار گیرند و در کدام سمت سواری کنند.
ویژگی float
float این ویژگی برای قرار دادن و فرمتدهی محتوا استفاده میشود، مانند حرکت دادن تصویر به چپ تا به متن در جعبه برسد.
float این ویژگی میتواند یکی از ارزشهای زیر را تنظیم کند:
- left - عناصر به سمت چپ جعبه خود سواری میکنند
- right - عناصر در سمت راست جعبه خود سواری میکنند
- none - عناصر سواری نمیکنند (در مکان نمایش داده شده در متن نمایش داده میشوند). ارزش پیشفرض.
- inherit - عناصر از ارزش float پدر خود را ارث میبرند
یکی از سادهترین کاربردها این است که،float این ویژگی میتواند به ایجاد اثر احاطهی نوشتهها توسط تصویر (مانند در روزنامهها) کمک کند.
مثال - float: right;
در مثال زیر، تصویر باید به سمت راست سواری کند:
领先的 Web 技术教程 - 全部免费。在 CodeW3C.com，你可以找到你所需要的所有的网站建设教程。从基础的 HTML 到 CSS，乃至进阶的 XML、SQL、JS、PHP。
我们的参考手册涵盖了网站技术的方方面面。其中包括W3C标准技术：HTML、CSS、XML 。以及其他技术，诸如 JavaScript、PHP、SQL 等。
在 CodeW3C.com，我们提供上千个实例。通过使用我们的在线编辑器，你可以编辑这些例子，并对代码进行实验。
实例
img {
float: right;
}
مثال - float: left;
در مثال زیر، تصویر باید در مکان نمایش داده شده در متن قرار گیردبه چپسواری:
领先的 Web 技术教程 - 全部免费。在 CodeW3C.com，你可以找到你所需要的所有的网站建设教程。从基础的 HTML 到 CSS，乃至进阶的 XML、SQL、JS、PHP。
我们的参考手册涵盖了网站技术的方方面面。其中包括W3C标准技术：HTML、CSS、XML 。以及其他技术，诸如 JavaScript、PHP、SQL 等。
在 CodeW3C.com，我们提供上千个实例。通过使用我们的在线编辑器，你可以编辑这些例子，并对代码进行实验。
实例
img {
float: left;
}
مثال - No float
در مثال، تصویر در مکان نمایش داده شده در متن ظاهر خواهد شد (float: none;):
领先的 Web 技术教程 - 全部免费。在 CodeW3C.com，你可以找到你所需要的所有的网站建设教程。从基础的 HTML 到 CSS，乃至进阶的 XML、SQL、JS、PHP。
我们的参考手册涵盖了网站技术的方方面面。其中包括W3C标准技术：HTML、CSS、XML 。以及其他技术，诸如 JavaScript、PHP、SQL 等。
在 CodeW3C.com，我们提供上千个实例。通过使用我们的在线编辑器，你可以编辑这些例子，并对代码进行实验。
实例
img {
float: none;
}
延伸阅读
课外书：CSS فلوٹنگ
