| Kosten | Вторник, 06 Февраля 2018, 06:03 | Сообщение 1 |
| Большинство разработчиков знают, что для того, чтобы структура сайта была отзывчивой и удобной для мобильных устройств, лучше определить ширины div и других элементов HTML, используя проценты, а не пиксели. Использование процентов для определения ширины позволяет изменять ширину элементов HTML при сохранении того же отношения к размеру его родительского контейнера, так как окно просмотра становится меньше, поэтому все элементы внутри него. Это очень полезно в гибком или мобильном дизайне.
Иногда использование процентов вместо пикселей для определения ширины элементов HTML может иметь несколько менее идеальных побочных эффектов. Например, давайте останемся у вас div, ширина которого определена как 80%. Если пользователь просматривает этот div на телефоне или ноутбуке, отображение div на 80% может выглядеть идеально пропорциональным. Однако, если пользователь просматривает один и тот же div на рабочем столе с большим монитором, div с шириной 80% может выглядеть огромным, и его размеры, вероятно, превысят размер, на котором он должен отображаться в исходном дизайне.
Эта проблема может быть исправлена с помощью медиа запросов, но зачем писать много лишних строк кода, когда проблема может быть решена с помощью одного простого свойства CSS. Предоставляя div максимальную ширину и определенную в пикселях, она позволяет ширине div составлять 80% от своего родительского элемента, не превышая при этом максимальную ширину в пикселях.
Вот пример того, как он должен выглядеть:
Код div{
width: 80%;
max-width: 1000px;
}
Используйте этот трюк, и вам никогда не придется беспокоиться о том, что элементы отображаются слишком сильно на большом мониторе.
| | Страна: (RU) |
| |
