 Автор |
Сообщение |
Shnap
Эксперт
 |
|
Привет! Нужно сделать так чтоб сайт перестал масштабироваться если ширина больше чем 1024px
Вот наглядный пример что должно быть
https://youtu.be/pDpSNf68oDo
Вот то что сделал я:
http://l90690ns.beget.tech
Добавляю
<meta name="viewport" content="max-width=1024, initial-scale=1.0">
И не работает... Сайт продолжает увеличивать масштаб.. ((
body {max-width: 1024px;} - тоже прописано..
Подскажите плз как это реализовать? Уже пол дня голову ломаю )) |
|
 |
|
 |
Richard Ferlow
Гуру
 Предупреждений : 2
|
|
Shnap
так у тебя сейчас максимальная ширина как ты задал - 1024. если тебе фон не надо чтобы на всю ширину был - убери его с body и задавай фон для блока |
|
| |
|
|
Shnap
Эксперт
|
|
Richard Ferlow
Вот видео снял для наглядности)
https://youtu.be/YKKlDWu9IYw
У меня все единицы в vw. По умолчанию они считают от ширины окна. А я хочу задать так чтоб считало от 1024 если ширина окна больше чем 1024. И по стандарту если меньше.
В сети говорят, что нужно написать мета в хэад
<meta name="viewport" content="max-width=1024">
Но чёт не работает ((  |
|
| |
|
|
Richard Ferlow
Гуру
Предупреждений : 2
|
|
| Shnap писал(а): |
| max-width=1024 |
что-то я не нашел вообще чтобы для viewport можно было так задавать.
А для чего все величины через vw задавать? |
|
| |
|
|
Shnap
Эксперт
|
|
| |
|
|
Richard Ferlow
Гуру
Предупреждений : 2
|
|
Shnap
там внизу указано что со всеми этими параметрами очень плохо с совместимостью у браузеров.
Вообще такой как ты описываешь способ я ни разу не видел чтобы использовали.
Обычно это делают через https://itchief.ru/lessons/html-and-css/css-media-queries - с помощью этой штуки делают адаптивную верстку. берутся какие-то усредненные шаги ширин экрана - например 1900, 1200, 760, 320 - и под них уже свои правила задают.
Вообще с адаптивной версткой рекомендую с фреймворками этим заняться, https://getbootstrap.com/ например.
пример что ты скидывал с погодой как раз с media-queries работает |
|
| |
|
|
ATX555
Гуру
 |
|
| Shnap писал(а): |
В сети говорят, что нужно написать мета в хэад
<meta name="viewport" content="max-width=1024">
Но чёт не работает (( |
Не хочется досканально разбираться, что за Вьюпорт, тем более он-же в стиль закатан? (В коде страницы не виден).
Но решается-то просто - старым добрым способом с указанием ширины вложенной таблицы в 1024 (<table width= ),
или в боди:
body {text-align:center;}
.content { max-width:1024px;
text-align:left;}
а уже внутри тега ожно задавать относительные и абсолютные размеры любыми средствами! |
|
| |
|
|
Shnap
Эксперт
|
|
Richard Ferlow
ATX555
Ну примерно понял, спасибо.
Видимо я не в ту сторону копаю)
Буду дальше разбираться. |
|
| |
|
|
|
