Css підручник

Місцезнаходження елементів задається за допомогою наступних CSS властивостей:

• top - встановлює величину зміщення поточного елемента від верхнього краю батьківського елементу;
• bottom - встановлює величину зміщення поточного елемента від нижнього краю батьківського елементу;
• left - встановлює величину зміщення поточного елемента від лівого краю батьківського елементу;
• right - встановлює величину зміщення поточного елемента від правого краю батьківського елементу.

Описані вище властивості не вступлять в силу доки Ви не задасте спосіб розміщення. Також спосіб розміщення визначає поведінку даних властивостей.

В CSS існують 4 різних способу розміщення елементів:

Статичні елементи завжди відображаються там, де вони були оголошені. CSS властивості top, bottom, left і right не працюють зі статичними елементами.

Всі елементи за замовчуванням розміщуються даними способом, але Ви також можете явно оголосити елемент статичним за допомогою position: static.

Абсолютно розміщені елементи розташовуються відносно першого батьківського елемента, спосіб розміщення якого відмінний від статичного. Якщо такі елементи не були знайдені, то елемент буде розташований щодо кореневого елемента (html).

Іноді для того, щоб домогтися бажаного ефекту батьківський елемент спеціально визначається як щодо розміщений з нульовим зміщенням.

Ви можете оголосити елемент абсолютно розміщеним за допомогою position: absolute.

При застосуванні властивостей позиціонування елементи можуть накладатися один на одного. Властивість z-index дозволяє встановити який елемент в разі накладення буде зверху, а який знизу.

Елементи з великим значенням властивості z-index розташовуються вище інших.

Зверніть увагу: властивість z-index може приймати негативні значення.