Мой сайт выглядит по-другому на мобильных устройствах
Эта статья была переведена с помощью машинного перевода. Сообщите нам, если найдете ошибки.
Мой сайт выглядит по-другому на мобильных устройствах
Что может быть причиной
ReFlow адаптирует веб-сайты Canva к разным размерам экрана, размещая элементы по вертикали. Поэтому широкие полноэкранные элементы могут изменить размер точно, а в разных браузерах, версиях браузеров и размерах устройств сайт может отображаться по-разному.
Что делать
- Проверьте перекрытия: Выберите элементы в дизайне и измените их размер или обрежьте их так, чтобы их границы не соприкасались.
- Разделите широкие элементы: Замените крупные элементы, занимающие всю ширину, на элементы меньшего размера, которые аккуратно выстраиваются друг под другом.
- Оставайтесь в пределах безопасных полей: Размещайте важные элементы внутри границ безопасных полей.
- Предварительный просмотр на мобильных устройствах: Во время редактирования используйте панель предварительного просмотра на мобильных устройствах. Считайте ее ориентировочной, так как опубликованный сайт может выглядеть по-разному в зависимости от устройства и браузера.
- Группируйте и блокируйте: Сгруппируйте связанные элементы, а затем заблокируйте группу, чтобы они оставались вместе.
Сгруппируйте элементы
Если вы хотите, чтобы определенные элементы располагались вместе, сгруппируйте их. В ином случае при просмотре на мобильных устройствах они могут разделиться.
- Наведите курсор на элементы, которые вы хотите сгруппировать. Вы также можете удерживать Смещение на клавиатуре и выбрать элементы.
- На плавающей панели инструментов выберите Группировать.
- Чтобы проверить, как сгруппированные элементы выглядят на мобильных устройствах, нажмите Предварительный просмотр.
- На панели предварительного просмотра нажмите кнопку Mobile, чтобы увидеть мобильный макет.
В примере ниже показано, как текстовые поля складываются при просмотре на мобильном устройстве.
Информация пригодилась?
Полезно
Не полезно