D.iK.iJ
 
Ссылки Поиск Написать В избранное NO

Блоггер / Блог 2016 год

RSS лента новостей, Подписка по Email

      Как уменьшить весь сайт при уменьшении ширины экрана?

         Встретил тут на одном форуме код и обсуждения на эту тему. Написал свою версию для примера.
         Так делать не нужно!

@media screen and (max-width: 768px) {
html { width: 100%; height: 150%; }
body { transform: scale(0.5); transform-origin: center top; }
}
@media screen and (max-width: 384px) {
html{width: 100%; height: 175%;}
body { transform: scale(0.25); transform-origin: center top; }
}

         Без использования зума, так как он не кроссбраузерный вообще. Да, мы просто трансформацией уменьшаем весь сайт. В примере код для 768 пикселей (и меньше) и для 384px.
         Я хотел написать скрипт, который уменьшал бы сайт автоматически, переводя ширину окна из пикселей в проценты... Но тогда шутка бы сильно затянулась. А у меня сейчас полно работы по нармальной адаптации. Без шуток.

         P.S. Для особо упертых (как я). Этот код правда не нужно использовать. Он уменьшает текст и ссылки, а на маленьких экранах их лучше даже увеличивать. Да и по ссылке я даю довольно много правильных советов по адаптации сайтов для мобильных телефонов и планшетов. Да и готовые начальные стили там есть.

         
         
Главная, 1,
( 44 )