Как можно использовать viewport, можно ли через него сделать масштабирования страницы?

Question

[Евгений Попов]

Всем привет! У меня есть небольшой сайт, где секции встроены по ширине экрана. Мобильной версии нет и не будет. Не могу понять как при уменьшении экрана сделать так, чтобы все автоматически масштабировалась, картинки уменьшались, и текст. Мне для этого нужно прописывать везде масштабируемые единицы em, или можно как то сделать при помощи вьпорта, не могу никак понять. При чем ширина контента у меня фиксирована до 1280px.

Comments

[tyzberd]

вам нужно что бы сайт подстраивался под размер экрана как на этом демо? https://www.templatemonster.com/demo/63345.html

[Евгений Попов]

tyzberd: там скорее всего с медиа запросами построена адаптивность, а мне нужно без них. Мне вот один товарищ сказал, что одним вьюпортом сделаем "мобильную" версию. Я вот и не могу понять как

[tyzberd]

При фиксированной ширине сайта и без viewport все нормально масштабируется.
Например если открыть эту страницу с мобильного images.all-free-download.com/free-website-template...
Но в таком случае текст будет не читаемый и нужно менять масштаб.
можно явно указать ширину но это не хорошо

Answer 1

[Иван]

<meta name="viewport" content="width=device-width, initial-scale=1">

ты про это?

Comments

[Евгений Попов]

нет, этот мета тег говорит браузеру, что сайт должен отображаться как есть, не масштабироваться автоматически при первоначальной загрузке (потом пальцами, конечно, можно масштабировать). А я хочу чтобы текст и картинки подстраивались под размер экрана. Наверно глупый я вопрос задал)

Answer 2

[Salim_Gareev]

@media only screen and (max-width: 938px){
Здесь нужно прописывать новые правила для отображения. Пример
.div{
width:100%;
}
}

Подробнее ищите по запросу @media css

Comments

[Евгений Попов]

да это я знаю) я видел сайты которые без медиа запросов плавно подстраиваются под размеры экранов