Рекомендуемый курс:

Функция CSS translateY()

Определение и использование translateY() Функция позволяет вам переналожить элемент по оси Y (вертикальная ось).

translateY() в Функция Используется в свойстве.

Пример

Переналожение различных элементов <div> по вертикальной оси:

#myDiv1 {
  transform: translateY(30px); /* Перемещает элемент на 30px по оси Y */
}
#myDiv2 {
  transform: translateY(50px); /* Перемещает элемент на 50px по оси Y */
}
#myDiv3 {
  transform: translateY(-10px); /* Перемещает элемент на -10px по оси Y */
}

Попробуйте сами

Грамматика CSS

translateY(Y)
Значение Описание
Y Обязателен. Определяет расстояние перемещения элемента по оси Y, может быть числом или процентом.

Технические детали

Версия: CSS Transforms Module Level 1

Поддержка браузерами

Числа в таблице указывают на версию первого браузера, который полностью поддерживает эту функцию.

Chrome Edge Firefox Safari Opera
1 12 3.5 3.1 10.5

Соответствующие страницы

Урок:CSS 2D transform

См. также:Свойство transform в CSS

См. также:Функция CSS translate()

См. также:Функция CSS translateX()

См. также:Свойство transform в HTML DOM