Float – це одна з основних властивостей CSS, яка дозволяє елементам веб-сторінки вирівнюватися по горизонталі та обтікати один одного. Воно широко використовується для створення складних макетів і розміщення елементів на сторінці в бажаному порядку.
Float може бути застосований до різних елементів HTML, таких як зображення, абзаци, таблиці та інші блоки. При цьому елементи з float зміщуватимуться ліворуч або праворуч, залежно від встановленого значення. Наприклад, елементи з float: left вирівнюватимуться по лівому краю, а елементи з float: right – по правому.
Float також дуже корисний під час створення адаптивного дизайну, дозволяючи елементам автоматично перебудовувати своє розташування залежно від розміру екрану. Він також може використовуватися для створення затекстовки, коли текст обтікає зображення, що робить макет більш естетично привабливим та покращує сприйняття інформації.
| Опис | Коли використовується |
|---|---|
| Правильне вирівнювання елементів | Для вирівнювання елементів усередині контейнера, наприклад, для створення стовпців у макеті або послідовного розташування зображень |
| Обтікання вмісту | Для обтікання тексту або іншого вмісту навколо плаваючого елемента |
| Створення адаптивного макета | Для створення адаптивного макету, який змінюється відповідно до розміру екрану |
| Створення багатоколонного макету | Для створення багатоколонного макету, де елементи вирівнюються поруч один з одним |
Float використовується для створення макетів з кількома колонками, навігаційних меню, галерей та багато іншого.
Де використовується float?
Спочатку використовуване для "обтікання" картинок текстом, властивість float стала одним з найчастіше використовуваних інструментів для створення макетів з кількох стовпців на веб-сторінках.
Що таке float значення?
Значення пливти, плавати ◆ Немає прикладу вживання (див. рекомендації).
Яке значення властивості float прибирає обтікання?
Якщо встановлено обтікання елемента за допомогою властивості float, то clear скасовує його дію для зазначених сторін.