LoftBlog: Создание адаптивных сайтов - урок четвертый. Гибкая сетка (Fluid grid) - видео HD
00:25:24
loftblog 299 роликов
74541 просмотр на сайте 12n.ru
Создание адаптивных сайтов - урок четвертый. Гибкая сетка (Fluid grid) - видео.
Пройди БЕСПЛАТНО профориентацию в IT — bit.ly/2NLILneМы продолжаем изучать науку создания адаптивных сайтов. В этом уроке мы рассмотрим еще один элемент responsive сайтов — гибкую сетку (fluid grid)Не ограничивай себя видеоуроками на YouTube! Узнавайте еще больше полезной информации! Общайтесь с опытными разработчиками, преподавателями и развивайся через личное общение! Telegram: telegram.me/loftblogSlack: slack.loftblog.ru/Наш сайт: loftblog.ru/ Instagram: www.instagram.com/loftblog/ВКонтакте: vk.com/loftblog facebook: www.facebook.com/loftblog twitter: twitter.com/loft_blog -----------------------------------------------------------------------------------Не забываем, что самый лучший способ сказать «спасибо» — нажать кнопку «нравится» и скинуть ссылку на урок друзьям. Ничто другое так сильно не мотивирует автора продолжать работу :)
развернуть свернуть
width: 8.333333333333332%;
}
.container .cols.col-2{
width: 16.666666667%;
}
.container .cols.col-3{
width: 25%;
}
.container .cols.col-4{
width: 33.333333333%;
}
.container .cols.col-5{
width: 41.666666667%;
}
.container .cols.col-6{
width: 50%;
}
.container .cols.col-7{
width: 58.333333333%;
}
.container .cols.col-8{
width: 66.666666667%;
}
.container .cols.col-9{
width: 75%;
}
.container .cols.col-10{
width: 83.333333333%;
}
.container .cols.col-11{
width: 91.666666667%;
}
.container .cols.col-12{
width: 100%;
}
Единственное, в css не рекомендуется использовать код .container .cols.col-4 {...} (без пробела между .cols и .col-4). Это считается плохой практикой. У тех кто пишет с пробелом код работать не будет. Вместо этого просто нужно использовать .col-4 {...}.