Grid.css - минимальная грид-система для веб-разработчиков

Большие рамки внешнего интерфейса, такие как Bootstrap, поставляются с собственными настройками сетки. Но они также идут с большим количеством багажа в виде предварительно разработанных элементов страницы и компонентов JavaScript.

Если вы ищете гораздо меньшую и оптимизированную систему сетки, то вам понравится Grid.css,

Эта бесплатная библиотека с открытым исходным кодом поставляется в комплекте с традиционной сеткой из 12 столбцов, которую можно структурировать для любого макета. CSS действительно прост в использовании, а сам файл имеет размер всего 560 байт (это половина КБ!)

Программы для Windows, мобильные приложения, игры - ВСЁ БЕСПЛАТНО, в нашем закрытом телеграмм канале - Подписывайтесь:)

Начать очень легко, и вам просто нужно добавить один CSS-файл в ваш заголовок.

Читайте также: 10 легких альтернатив Bootstrap & Foundation

Вы можете найти прямую ссылку для скачивания на Grid.css домашняя страница или в официальном GitHub репо, Вы могли бы даже использовать сырая версия CDN встроить этот файл непосредственно из GitHub, не размещая его самостоятельно.

Теперь вы можете настроить структуру столбцов, используя любые элементы, которые вы хотите (элементы div, разделы и т. Д.).

Обычно это элемент .row (контейнер) и множество элементов внутреннего столбца. Классы столбцов используют числа, чтобы определить их общее пространство внутри контейнера, поэтому, например, .col4 занимает четыре столбца из двенадцати общего количества.

Вот пример фрагмента из демонстрации:

Вы можете использовать любую комбинацию классов столбцов, которые вам нравятся, но только до 12.

Это означает, что вы также можете реструктурировать страницу, как хотите, используя разные контейнеры строк. Например, у вас может быть один большой диапазон для вашего заголовка, но вы можете использовать две разные настройки строки / столбца для тела страницы.
Естественно, эта библиотека на 100% бесплатна и имеет открытый исходный код, поэтому вы можете вносить изменения по своему усмотрению.

Создатель, Ахмед Тарек, также создал Butns, который является вариантом набора многокнопочного пользовательского интерфейса. Он прекрасно сочетается с Grid.css, так что они являются отличными библиотеками для запуска при запуске нового веб-проекта.

Читайте также: Spectre.css – легковесный адаптивный CSS-интерфейс на основе Flexbox