Свойство top - это мощный инструмент для контроля вертикального положения элементов. Оно позволяет точно смещать объект относительно его верхней границы, придавая верстке необходимую точность и гибкость. Однако то, как именно произойдет сдвиг, полностью определяется тем, какое значение установлено в свойстве position: - Если элемент имеет фиксированное позиционирование (
position: fixed;), он будет двигаться вверх или вниз строго относительно верхней кромки окна браузера. - При абсолютном позиционировании (
position: absolute;) сдвиг происходит относительно верхнего края ближайшего предка, который тоже является позиционированным (то есть не static). Если же такой «якорный» предок отсутствует, элемент ориентируется на верхнюю границу окна браузера. - Элемент с относительным позиционированием (
position: relative;) смещается вверх или вниз относительно того места, где он находился бы по умолчанию в потоке документа. - В случае со статическим позиционированием (
position: static;) применение свойства top абсолютно бесполезно и не даст никакого визуального эффекта. Примечание: допускается использование отрицательных значений. | Значение по умолчанию: | auto | | Наследуется: | нет | | Версия: | CSS2 | | Синтаксис JavaScript: | object.style.top="50px" | | Значение | Описание | | auto | Браузер сам вычисляет положение верхнего края. | | расстояние | Определяет расстояние от верхнего края в единицах измерения, поддерживающихся в CSS. | | % | Расстояние смещения от верхнего края, указанное в процентах, вычисляется в зависимости от высоты окна браузера (области просмотра) или от высоты элемента предка ( + ). | | inherit | Указывает, что значение наследуется от родительского элемента. | Пример
|