2017-02-20 21 views
0

Мне было интересно, есть ли способ изменить масштаб на веб-странице html в соответствии с размером монитора. Например, изображение 500px на 500px будет выглядеть большим на ноутбуке, хотя монитор для ПК заставит его выглядеть маленьким. Является ли возможным решение, которое я могу сделать, чтобы размер изображения был увеличен по мере изменения размера монитора? Кроме того, я хотел бы, чтобы экран просто увеличивал масштаб изображения в пикселях.html - Автоматическое масштабирование до разных размеров монитора

Спасибо!

+0

это называется отзывчивым дизайном, вы можете использовать boostratp, который очень хорош и прост в использовании (класс: '.img-responsive') –

+0

@singebatteur Что произойдет, если вы хотите сделать это с другим элементом, например холстом? –

+0

Я не знаю о холсте, но для «классических» элементов вам просто нужно установить относительную ширину, например, 50%, и это будет 50% от 500 пикселей, 50% от 1920 пикселей ... –

ответ

1

Вы можете использовать % вместо px для установки размера изображения.

В HTML 4.01 ширина может быть определена в пикселях или в% от содержащего элемента. В HTML5 значение должно быть в пикселях.

Источник: https://www.w3schools.com/tags/att_img_width.asp

Или в CSS вы можете использовать медиа-запросы, чтобы иметь различный стиль в зависимости от используемого устройства.

+0

Как бы я динамически менял размер , например, при изменении размера окна? –

+0

, если размер установлен в процентах, любая модификация размера контейнера будет пропорционально изменять его. Для медийных запросов я приглашаю вас прочитать: https://www.w3schools.com/css/css3_mediaqueries.asp – Sylvain

+0

Я имел в виду масштабирование, а не размер изображения. –