Здравствуйте. Помогите пожалуйста адаптировать сайт. Учусь сайтостроительству только несколько месяцев, и это мой второй пример, когда не получается адаптировать сайт под мобильные и планшеты... Использую bootstrap(пытаюсь использовать). Сам сайт
Пытался прописывать col-xs и 12 и 6.. и col-md добавлял.. Всё равно не адаптируется... Получается, что ширина блоков где "купить 3D ручку", они всё равно шире, чем шапка и остальная часть сайта.... Помогите пожалуйста!!
-
Тоже долго мучался с одним сайтом. Потом сделал заметку сам для себя, чтобы не забывать. Может кому пригодится http://royal-site.ru/verstka/kak-sdelat-adaptivnyj-dizajn-sajta-pod-vse-razresheniya-ekrana/– Артем Губтор1 дек 2018 в 7:08
Добавить комментарий
|
1 ответ
Используйте меди-запросы:
<!-- CSS media query on a link element -->
<link rel="stylesheet" media="(max-width: 800px)" href="example.css" />
или
<!-- CSS media query within a stylesheet -->
<style>
@media (max-width: 600px) {
.facet_sidebar {
display: none;
}
}
</style>
смысл в том, что css правило срабатывате только когда экран достигаете указанной ширины. Т.е. для мальнеких экранов вы пишите одни стили, а для больших другие. И разруливаете это всё с помощью, @media (max-width: XXXpx)
-
а мне нужно дополнительно к медиа запросам , еще указывать в html col-xs и прочие форматы?– dANiiL1 дек 2016 в 20:56
-
нет не нужно. col-xs - это бутстраповский @mediaquery - getbootstrap.com/css 2 дек 2016 в 14:44