1

Добрый день, уважаемые знатоки:) Вопрос на засыпку. Имеется сайт. Но не устраивает масштаб всего сайта в целом. Уменьшаю масштаб сайта до 70-75% путем CTRL - и картинка устраивает. Возможно ли сделать уменьшение масштаба сайта через CSS итд не прибегая к изменению размера всех блоков. Тоесть чтобы грузился не 100% масштаб а 75% к примеру. Спасибо заранее.

P.S. Нужно кроссбраузерное решение...

1
  • по идее zoom должен помочь caniuse.com/#feat=css-zoom (для firefox можно использовать -moz-transform: scale(2); -moz-transform-origin: 0 0; 24 фев 2017 в 16:06

2 ответа 2

1

Измените масштаб body

body {
   -webkit-transform: scale(0.75);
   -moz-transform: scale(0.75);
   -ms-transform: scale(0.75);
   transform: scale(0.75);
   -webkit-transform-origin: center 0;
   -moz-transform-origin: center 0;
   -ms-transform-origin: center 0;
   -o-transform-origin: center 0;
   transform-origin: center 0;
}
4
  • Сработало,Спасибо! Но теперь бэкграунд поплыл :( 24 фев 2017 в 16:33
  • ну, значит, он неправильно был настроен. 24 фев 2017 в 16:34
  • Вот очень непростой в верстке сайт polati.zephyrlab.ru Поставьте там в браузере вот такие стили для body, как в ответе. И увидите, что все работает 24 фев 2017 в 16:37
  • @AndrewFoxis для картинок попробуйте image-rendering: optimizeQuality 24 фев 2017 в 18:19
1

На body добавьте свойство zoom:

body {    
  zoom: .75 
}

Работает даже в IE 8.

Вот только данное свойство в FireFox не сработает. Для него можно сделать полифил:

body {
   -moz-transform: scale(.75);
   -moz-transform-origin: center 0;
}

Однако transform в FF может повлиять на отрисовку картинок. Для исправления этого советую воспользоваться решением из этого вопроса:

img {
    image-rendering: optimizeQuality
}

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.