Как уменьшить масштаб картинки в html

Главная " Современный учебник CSS " Использование CSS " Background-size: масштабирование фонового изображения Background-size: масштабирование фонового изображения Когда вы добавляете фоновое изображение с помощью свойства background-image, по умолчанию оно отображается в своем реальном размере. Это не всегда удобно, поэтому в CSS3 появилось новое свойство background-size, позволяющее изменять размер фонового изображения. Значения для свойства background-size можно задавать с помощью ключевых слов и в любых единицах измерения CSS.

В одной записи вы можете указать размеры как для одной стороны, так и для обеих сторон - горизонтальная и вертикальная согласованность очень важна. Ключевое слово auto по умолчанию соответствует горизонтали и вертикали, т.е. если auto задано только для одной стороны, размер фона будет автоматически подстроен под пропорции изображения. Например, если вы напишете следующее: background-size: px auto; ...то высота фонового изображения будет рассчитана автоматически.

В зависимости от формы и вида изображения, оно растягивается до полного соответствия либо по ширине, либо по высоте. Пропорции изображения сохраняются. Если пропорции элемента не соответствуют пропорциям изображения, это может привести к тому, что часть рисунка будет скрыта. Числовые значения Как мы уже говорили, размер фонового рисунка может быть задан в пикселях, процентах и других единицах измерения CSS.

Например, его удобно использовать, когда размер элемента указан в процентах. Поддержка браузеров Практически все используемые браузеры, как настольные, так и мобильные, хорошо работают со свойством background-size. Internet Explorer понимает его, начиная с версии 9.

Текст учебника: Написание стиля для фона, используя ярлык "multi"-свойство background.


Навигация

Comments