Расположение сетки - почему я должен использовать это, и я должен использовать структуру как Bootstrap или Foundation?
У меня был опыт работы с Twitter Bootstrap и Foundation, и я лично думаю, что единственное, что я хочу использовать, - это их сеточная система. Другие функции просто раздуты.
Поэтому я прочитал о перспективах расположения сетки. Все статьи, которые я нашел, ориентированы на "художественное" объяснение (т. Д. Золотого сечения). В глубине души я программист, мне нужна четкая и логичная причина для использования компоновки сетки (например: "столбцы можно легко размещать друг на друге на экране мобильного устройства и расширять по горизонтали на больших экранах"). Может кто-нибудь дать мне плюсы и минусы применения системы сетки на моем сайте? Лично вы думаете, что использование системы сетки хорошо?
Если ответ "да", должен ли я использовать готовую сеточную систему, такую как Twitter Bootstrap/Foundation, или просто создать собственную? Все остальные функции мне не нужны и не имеют отношения к моей проблеме.
Спасибо!:D
2 ответа
Я согласен с @kunalbhat, что это, возможно, не лучший вопрос, чтобы спросить об этом, но, поскольку вы это сделали, я постараюсь ответить на него.
Сетки разработаны с учетом скорости и адаптируемости. Скорость в нескольких смыслах. Первая часть скорости - это скорость написания кода. Вы можете легко получить нужный макет, когда используете систему сетки, и все выровнено правильно. Вам не нужно запоминать таблицы и столбцы, элементы col-span и т. Д.
Вторая скорость - это изменение вашего кода. Неизбежно вам нужно будет вернуться и внести изменения, с сеткой это легко сделать. Замена col-md-7 на col-md-6 легко вносит небольшие изменения в макет вашей страницы, которые можно легко отслеживать и выполнять.
Вы упомянули адаптивный дизайн, у Bootstrap и Foundation есть адаптивные сетки. Сетки будут привязываться к разным размерам в зависимости от размера области просмотра. Однако у вас также есть контроль. Например, если вы хотите, чтобы что-то занимало 1/12 экрана на рабочем столе, 1/4 на планшете и 100% на телефоне, что легко сделать с помощью Bootstrap и Foundation, оба имеют классы сетки, предназначенные для определенных видов.
Они также предоставляют классы видимости на основе этих окон просмотра.
Для "раздутой" части это легко решаемо. Используя SCSS, вы можете легко импортировать только части библиотеки. Например, для одного проекта, в котором я работал, я только импортировал Grid, и он был значительно меньше.
Мне кажется, что это вопрос SO, просто из-за одного из основных минусов CSS-грид-систем: семантического.
Я думаю, что семантика важна для веб-разработчика, и наличие класса с именем col-md-7 - не самая семантическая вещь, которую нужно делать.
Но мне нравятся сетки, потому что ими легко и быстро пользоваться, поэтому я начал использовать LESS. Поскольку это позволяет мне использовать переменные и функции (миксины) в CSS, я могу построить свою собственную систему сетки на моем CSS, а не на моем HTLM.
Вы можете начать с Frameless и настроить свои собственные "классы".