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

Функция scaleX() в CSS

Определение и использование scaleX() Функция определяет и использует в CSS.

scaleX() Функция используется для горизонтального масштабирования элементов.

scaleX() Функция добавляет или уменьшает ширину элемента. transform Используется в свойстве.

Пример

Пример 1

Используйте scaleX() Масштабировать ширину нескольких элементов <div>:

#myDiv1 {
  transform: scaleX(0.7);
}
#myDiv2 {
  transform: scaleX(90%);
}
#myDiv3 {
  transform: scaleX(1.1);
}

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

Пример 2

Используйте scaleX() Масштабировать ширину изображения:

#img1 {
  transform: scaleX(0.6);
}
#img2 {
  transform: scaleX(90%);
}
#img3 {
  transform: scaleX(-0.6);
}
#img4 {
  transform: scaleX(1.1);
}

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

Грамматика CSS

scaleX(s)

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

Поддержка браузеров

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

Связанные страницы

Урок:2D-трансформации в CSS

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

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

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

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

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