Правильно ли использовать CSS3 VW & VH в 2016 году для адаптивных сайтов и сайтов CrossBrowse?

Я бродил, если в 2016 году будет правильное время и место для использования блоков css3 vw & vh для создания адаптивных сайтов, из моего опыта это самый простой способ сделать это... но я почти не видел, чтобы этот метод использовался почти нигде. Почему это так? И если у вас есть лучший способ сделать отзывчивые сайты, пожалуйста, поделитесь...

1 ответ

Решение

VH и VW относятся к высоте / ширине области просмотра, поэтому они идеально подходят для масштабирования элементов в зависимости от размера области просмотра.

Например, если вы хотите макет с двумя столбцами, указание ширины каждого столбца как 50vw будет работать хорошо. Согласно Can I Use поддержка браузера хороша, если вам не нужно использовать vmax.

Масштабирование - это один аспект адаптивного дизайна, другой - изменение макета страницы.
Как правильно отметил George Chanturia ниже, следующие комментарии относятся к адаптивному дизайну, а не адаптивному дизайну.

Скажем, вы хотели, чтобы макет с двумя столбцами сворачивался в один столбец на смартфонах, возможно, вы захотите использовать медиа-запросы и пиксели, или суммы, или суммы

например

@media only screen and (max-width: 25em) { 
...
}

или же

@media only screen and (max-width: 400px) {
...
}

Конечно, вы можете использовать VM и VW внутри этих медиа-запросов, но это не та функция, которую вы можете проверить в реальном медиа-запросе.

Надеюсь это поможет.

Другие вопросы по тегам