Опубликован: 31.10.2006 | Уровень: для всех | Доступ: платный
Лекция 12:

Позиционирование в CSS

< Лекция 11 || Лекция 12: 1234 || Лекция 13 >
Параметр 'top'

Данный параметр определяет верхний край элемента.

Примечание: Если параметр "position" имеет значение "static", то параметр "top" не оказывает влияния.

Наследование: нет.

Примеры:

  1. В примере показано, как задать верхний край элемента pre на 50 px ниже верхнего края окна:
    pre
    {
    position: absolute;
    top: 50px
    }
  2. В примере показано, как задать верхний край элемента pre на 50 px выше верхнего края окна:
    pre
    {
    position: absolute;
    top: -50px
    }

Может принимать следующие значения:

Значение Описание
auto Позволяет браузеру вычислить верхнюю позицию.
% Задает верхнюю позицию в % от значения верхнего края окна.
length Задает верхнюю позицию в px, см, и т.д. от верхнего края окна. Допускаются отрицательные значения.
Параметр 'vertical-align'

Данный параметр задает вертикальное выравнивание элемента.

Наследование: нет.

Примеры:

img
{ 
vertical-align: baseline
}

Может принимать следующие значения:

Значение Описание
baseline Элемент размещается на базовой строке родительского элемента.
sub Выравнивает элемент как нижний индекс
super Выраванивает элемент как верхний индекс
top Вершина элемента выравнивается с вершиной самого высокого элемента в строке
text-top Вершина элемента выравнивается с вершиной шрифта родительского элемента
middle Элемент помещается в середине родительского элемента
bottom Нижняя часть элемента выравнивается с самым нижним элементом в строке
text-bottom Нижняя часть элемента выравнивается с минимальной нижней точкой родительского элемента
length
% Выравнивает элемент в % от значения параметра "line-height". Допускаются отрицательные значения.
Параметр 'z-index'

Данный параметр задает порядковый номер элемента в стеке. Элемент с большим порядковым номером стека всегда находится перед элементом с меньшим порядковым номером стека.

Примечания:

  1. Элементы могут иметь отрицательные порядковые номера стека.
  2. Z-index работает только с теми элементами, которые были позиционированы не как static (например, position:absolute; )!

Наследование: нет.

Пример:

img
{
position:absolute 
z-index: 1
}

Может принимать следующие значения:

Значение Описание
auto Порядковый номер элемента в стеке равен номеру родительского элемента
number Задает порядковый номер элемента в стеке
< Лекция 11 || Лекция 12: 1234 || Лекция 13 >
Федор Антонов
Федор Антонов

Здравствуйте!

Записался на ваш курс, но не понимаю как произвести оплату.

Надо ли писать заявление и, если да, то куда отправлять?

как я получу диплом о профессиональной переподготовке?

Илья Ардов
Илья Ардов

Добрый день!

Я записан на программу. Куда высылать договор и диплом?

Елена Елаева
Елена Елаева
Россия
Владимир Лагодный
Владимир Лагодный
Россия