|
Следующая версия
|
Предыдущая версия
|
display [2023/09/18 19:35] tro создано |
display [2023/09/19 18:21] (текущий) tro |
| ====== display ====== | ====== display ====== |
| Іноді необхідно, щоб рядковий елемент поводився, як блоковий і навпаки. У цьому випадку, значення властивості display можна за необхідності міняти на будь-яке інше. | Іноді необхідно, щоб рядковий елемент поводився, як блоковий і навпаки. У цьому випадку, значення властивості display можна за необхідності міняти на будь-яке інше. |
| * **Рядкові елементи** призначені для виділення та оформлення текстового контенту. Наприклад посилань кнопок, зображень тощо. | |
| * **Блокові елементи** використовуються для розмітки текстових контейнерів (заголовків, списків, абзаців) і великих смислових розділів (секцій, шапки, підвалу). | [[https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_flexible_box_layout/Aligning_items_in_a_flex_container|Опис тегу]] |
| | |
| | * **inline ** - Рядкові елементи - призначені для виділення та оформлення текстового контенту. Наприклад посилань кнопок, зображень тощо. |
| | * **block** - Блокові елементи використовуються для розмітки текстових контейнерів (заголовків, списків, абзаців) і великих смислових розділів (секцій, шапки, підвалу). |
| | * **inline-block** - Рядково-блокові елементи. Гібрид між блочними та рядковими елементами, який взяв корисне від обох. Їх ширина і висота залежать від вмісту, але можна явно задати властивості width і height. Вони розташовуються в рядку доти, поки в ньому є достатньо місця, після чого нові переносяться на наступний рядок. Їм можна задавати будь-які властивості геометрії елемента: ширину, висоту, поля, рамки та відступи. |
| | * **flex** - горизонтально вистроює вертикальні списки |
| | * **none** - елемент видаляється з дерева доступність. Це призводить до того, що елемент і всі його дочірні елементи не сприйматимуться технологіями читання екрана. |
| |