zoom

Время чтения: меньше 5 мин

Это незавершённая статья. Вы можете помочь её закончить! Почитайте о том, как контрибьютить в Доку.

Кратко

Секция статьи "Кратко"

Свойство zoom масштабирует элемент согласно заданному значению.

Пример

Секция статьи "Пример"
        
          
          <p class="small-text">При наведении текст уменьшается на 50%<p><p class="normal-text">Сохраняется исходный размер текста<p><p class="big-text">При наведении текст увеличивается в 2 раза<p>
          <p class="small-text">При наведении текст уменьшается на 50%<p>
<p class="normal-text">Сохраняется исходный размер текста<p>
<p class="big-text">При наведении текст увеличивается в 2 раза<p>

        
        
          
        
      
        
          
          .small-text:hover {  zoom: 50%;}.normal-text:hover {  zoom: normal;}.big-text:hover {  zoom: 2;}
          .small-text:hover {
  zoom: 50%;
}

.normal-text:hover {
  zoom: normal;
}

.big-text:hover {
  zoom: 2;
}

        
        
          
        
      

Как пишется

Секция статьи "Как пишется"

У zoom есть четыре значения:

  • normal — задаёт элементу исходный масштаб. Значение по умолчанию.
  • число — коэффициент масштабирования. 1.0 эквивалентно значению normal.
  • процент — процентное значение. 100% эквивалентно значению normal.
  • reset — не изменяет масштаб элемента, если пользователь применяет к документу масштабирование без сведения (разведения) пальцев, т. е. масштабирование, применимое к сенсорным интерфейсам. Это нестандартное значение, перед его использованием следует проверить поддержку на Can I use.

Подсказки

Секция статьи "Подсказки"

💡 Значение свойства не наследуется.

💡 Применимо ко всем элементам.

💡 Свойство можно анимировать.