Bootstrap: различный контент для экранов XS

-1

Я разрабатываю сайт PHP/MYSQL. Для большинства страниц отзывчивый дизайн с Bootstrap прекрасен. Но для нескольких страниц не только столбцы должны переупорядочивать для xs размер экрана, но также меняется содержание разделов. Ниже приведен пример страницы, которая сильно отличается для версии xs версии.Bootstrap: различный контент для экранов XS

То, что я сделал просто: я использовал hidden-xs, чтобы скрыть расположение на больших экранах и visible-xs, чтобы показать расположение на маленьких экранах. Поэтому я предполагаю, что страница требует в два раза больше ресурсов для загрузки, что не очень оптимально.

Есть ли более оптимизированный способ решения этой проблемы различного стиля и контента для разных размеров экрана, когда речь идет только о нескольких страницах? (если все страницы, где очень разные, я думаю, лучшим решением было бы создание мобильной версии в поддомене).

источник

2016-05-20 michltm

Bootstrap называет себя мобильным первым. Что происходит, когда вы думаете об этом наоборот? Сначала создайте его для мобильных устройств, затем укажите части, необходимые для больших экранов. – Flummox

Может ли человек, который проголосовал за мой вопрос, объяснить, почему он это сделал, чтобы я мог сделать его более ясным? – michltm

Я знаком с методом, хотя лично у меня никогда не было возможности его использовать. Вы можете создавать таблицы стилей для разных размеров экрана.

<head> 
     <link rel='stylesheet' media='screen and (min-width: 1px) and (max-width: 257px)' href='your-css.css'/> 
</head>

источник

2016-05-20 10:16:55

Да, я использую эту технику. Но в некоторых случаях меняется не только стиль, но и некоторые отделы. Вот почему легко просто скрыть div и сделать видимым новый. То, что я не уверен, - это все подразделения, загруженные в этом случае, или только видимые, т. Е. Страница в 2 раза более тяжелая. – michltm

Bootstrap: различный контент для экранов XS

ответ

Смежные вопросы