scale()
Оновлено: 17.01.2023
scale()
Масштабує елемент у двовимірному просторі по горизонталі та вертикалі або одночасно у двох напрямках. Зміна масштабу може відбуватися як у більший, так і в менший бік.
Синтаксис
transform: scale(sx);
transform: scale(sx, xy);
Значення
| sx | Масштаб елемента по горизонталі. |
| sy | Масштаб елемента по вертикалі. Якщо значення не вказано, то за замовчуванням приймається рівним sx. |
Одне значення задає масштабування елемента одночасно по горизонталі та вертикалі, зі збереженням пропорцій сторін елемента. Два значення задають масштаб елемента по горизонталі та вертикалі незалежно, що може призвести до спотворення пропорцій сторін.
Приклад
У цьому прикладі під час наведення покажчика на картинку вона плавно збільшує свій масштаб. Щоб розміри блоку залишалися вихідними використовується властивість overflow зі значенням hidden