WebUniverseБлокові елементи
Пояснення:
Блоковий елемент - тег <div></div>
За допомогою тегу <div> розміщуються різні елементи на сторінці, або об'єднюється група елементів.
До блокових елементів відносять такі теги як <p> <table> <ul> <ol> <li> <h1-h6>
Властивість display для елементів на сторінці
За допомогою властивості display в стилізації, задають як має бути показана група тегів.
Три поширені види - display: block; | display: inline-block; | display: none;
Розміщення(позиціонування) блоків на сторінці за допомогою стилізації
Розглянемо властивість розміщення блоків на сторінці в стилізації - position.
Для позиціонування(розміщення) використовують властивості position: absolute | fixed | relative
Визначити розташування блоків допоможуть властивості top: | right: | bottom: | left:
Загальний приклад позиціонування - position
Таблиця:
| № | Тема | Приклад коду | Підсумок |
|---|---|---|---|
| 1 | div | | div — це блочний елемент, який за замовчуванням займає всю ширину контейнера. |
| 2 | display: block | | display: block робить елемент блочним, займає всю доступну ширину. |
| 3 | display: none | | display: none повністю приховує елемент, він не займає місця на сторінці. |
| 4 | display: inline-block | | display: inline-block дозволяє елементу бути рядковим, але з властивостями блочного (width, height). |
| 5 | vertical-align | | vertical-align визначає, як inline або inline-block елемент вирівнюється вертикально відносно рядка або сусідніх елементів (top, middle, bottom, baseline, text-top, text-bottom). |
| 6 | position: relative | | position: relative дозволяє зміщувати елемент від його початкового місця. |
| 7 | position: absolute | | position: absolute позиціонує елемент відносно найближчого батька з позицією. |
| 8 | position: fixed | | position: fixed фіксує елемент відносно вікна браузера, навіть при прокрутці. |
| 9 | top і left | | top і left визначають відступи елемента від країв контейнера або вікна залежно від position. |
build info
- compiler
- 2.0.5.1 · 4054EF9BF6C4510A
- built
- 2026-11-08 14:31:25 UTC