English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية
Свойство top CSS определяет верхний край элемента. Это свойство определяет смещение между верхней границей внешней рамки定位анного элемента и верхней границей содержимого.
Для элементов относительного определения, если top и bottom оба auto, их значение расчета равно 0; если один из них auto, то берется противоположное значение другого; если оба не auto, bottom принимает значение top в противоположном направлении.
Внимание: Если значение свойства position равно "static", то установка свойства top не будет иметь никакого эффекта.
ДляАбсолютно позиционированныйЭлемент, свойство top которого определяет расстояние от верхнего края рамки элемента до верхнего края блока содержимого.
ДляОтносительно позиционированияЭлемент, свойство top которого определяет смещение верхнего края рамки элемента относительно верхнего края рамки herself (то есть, для рамки задается позиция в нормальном потоке, затем от этой позиции отступают на эти свойства).
Таблица ниже предоставляет описание использования и историю версий этого свойства, а также грамматику использования этого свойства в скриптах JavaScript.
| Значение по умолчанию: | auto |
|---|---|
| Применяется к: | Элементы позиционирования |
| Инherit: | Нет |
| Анимировано: | Да.Пожалуйста, обратитесь к Анимационные свойства. |
| Версия: | CSS 2, 3 |
| Грамматика JavaScript: | object.style.top="60px" |
Грамматика этого свойства такая:
top: length | percentage | auto | initial | inherit
Ниже приведен пример того, как использовать свойство top.
p {
position: absolute;
top: 150px;
}Протестируйте, посмотрите‹/›Таблица ниже описывает значения этого свойства.
| Значение | Описание |
|---|---|
| length | Числовое значение в единицах px, pt, cm, em и т.д., разрешены отрицательные значения. |
| percentage | Указать процентное смещение. Расчет процента относительно высоты блока содержимого элемента. Разрешены отрицательные проценты. |
| auto | Браузер вычисляет положение верхнего края. Это значение по умолчанию. |
| initial | Установить этот параметр в его значение по умолчанию. |
| inherit | Если указано, то связанный элемент принимает значение свойства top родительского элемента. |
Совместимость браузеров для свойства top; числа в таблице представляют собой минимальную версию браузера, поддерживающего это свойство; все основные браузеры поддерживают это свойство.
|
Пожалуйста, обратитесь к следующим учебникам:CSS позиция,CSS слой.