|
Здравствуйте! Записался на ваш курс, но не понимаю как произвести оплату. Надо ли писать заявление и, если да, то куда отправлять? как я получу диплом о профессиональной переподготовке? |
Опубликован: 31.10.2006 | Уровень: для всех | Доступ: платный
Лекция 12:
Позиционирование в CSS
Параметры позиционирования в CSS
Параметры позиционирования в CSS позволяют:
- определить левую, правую, верхнюю и нижнюю позиции элемента:
- задать форму элемента:
- поместить элемент позади другого:
- определить, что будет происходить, когда содержимое элемента слишком большое для размещения в указанной области.
Данные параметры поддерживаются следующими браузерами: Internet Explorer, Firefox, Netscape.
| Параметр | Описание | Значения | IE | F | N | W3C |
|---|---|---|---|---|---|---|
| bottom | Задает, насколько далеко нижний край элемента находится выше/ниже нижнего края родительского элемента | auto | 5 | 1 | 6 | 2 |
| % | ||||||
| length | ||||||
| clip | Задает форму элемента. Элемент вырезается по форме и выводится. | shape | 4 | 1 | 6 | 2 |
| auto | ||||||
| left | Задает, насколько далеко левый край элемента находится правее/левее левого края родительского элемента | auto | 4 | 1 | 4 | 2 |
| % | ||||||
| length | ||||||
| overflow | Определяет, что происходит, когда содержимое элемента переполняет его область | visible | 4 | 1 | 6 | 2 |
| hidden | ||||||
| scroll | ||||||
| auto | ||||||
| position | Помещает элемент в статическое, относительное, абсолютное или фиксированное положение | static | 4 | 1 | 4 | 2 |
| relative | ||||||
| absolute | ||||||
| fixed | ||||||
| right | Задает, насколько далеко правый край элемента находится левее/правее правого края родительского элемента | auto | 5 | 1 | 6 | 2 |
| % | ||||||
| length | ||||||
| top | Задает, насколько далеко верхний край элемента находится выше/ниже верхнего края родительского элемента | auto | 4 | 1 | 4 | 2 |
| % | ||||||
| length | ||||||
| vertical-align | Задает выравнивание элемента по вертикали | baseline | 4 | 1 | 4 | 1 |
| sub | ||||||
| super | ||||||
| top | ||||||
| text-top | ||||||
| middle | ||||||
| bottom | ||||||
| text-bottom | ||||||
| length | ||||||
| % | ||||||
| z-index | Задает порядковый номер элемента в стеке | auto | 4 | 1 | 6 | 2 |
| number |
Параметры позиционирования в CSS: подробное рассмотрение
Параметр 'bottom'
Данный параметр определяет нижний край элемента.
Примечание:Если параметр "position" имеет значение "static", параметр "bottom" не оказывает влияния.
Наследование: нет.
Примеры:
- В примере показано, как задать нижний край элемента pre на 50 px выше нижнего края окна:
pre { position: absolute; bottom: 50px } - В примере показано, как задать нижний край элемента pre на 50 px ниже нижнего края окна:
pre { position: absolute; bottom: -50px }
Может принимать следующие значения:
| Значение | Описание |
|---|---|
| auto | Позволяет браузеру самостоятельно вычислить нижнюю позицию |
| % | Задает нижнюю позицию в % от положения нижнего края окна |
| length | Задает нижнюю позицию в px, см, и т.д. от нижнего края окна. Допускаются отрицательные значения. |
Параметр 'clip'
Данный параметр задает форму элемента.
В ситуации если, например, изображение больше того элемента в котором располагается, параметр позволяет определить размеры изображения, обрезать по форме и вывести.
Примечание: Этот параметр нельзя использовать для элементов с параметром "overflow", заданным как "visible".
Наследование: нет.
Пример:
p
{
position:absolute;
clip:rect(2px 175px 100px 0px)
}Может принимать следующие значения:
