Яндекс.Метрика

Дизайн-журнал №1. Актуальная информация для дизайнеров, веб дизайнеров, программистов и разработчиков сайтов.

Адаптивные системы сеток

26 августа 2013 | Опубликовано в Веб-дизайн | 3 Комментариев »

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

 
 

Skeleton  

Skeleton представляет собой набор файлов CSS для веб-дизайнеров, которым необходимо быстро делать макеты. Это больше, чем просто система сеток, Skeleton также предусматривает несколько основных функций для решения общих задач веб-страницы, таких, как сброс CSS для нормализации вашего CSS.

Neat

Основная цель —  внедрять семантическую разметку HTML, используя Cacc Mixins. Начните с прочтения документов и изучения некоторых примеров. Скачать сетку можно здесь.

Simple Grid

Если вы приверженец минимализма, то это то, что вам нужно. 

Profound Grid

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

Griddle

Сетки для веб-дизайнеров и веб-сайтов, которые ставят акцент на современные браузеры. Эта система сеток использует смешанные функции — использование усиленных «inline-block» и «box-sizing» свойств и придает разметке новые особенности, что традиционная float разметка не может дать. 

Extra Strength Responsive Grids

Сети дополнительной силы реагирования — эта система для вас, если вы чувствуете, что другие системы сеток  слишком ограничены и, если вы отдали приоритет адаптивной верстке.

Proportional Grids

Название «Пропорциональные сети» говорит само за себя. Они позволяют использовать фиксированные единицы измерения для блоков, в то время, как колонки будут оставаться изменчивыми. 

Dead Simple Grid

Если вы просто хотите несложную адаптивную сетку, то эта сетка для вас, которая  имеет только два CSS класса. 

Responsive Grid System

Эта сетка дает вам немного больше гибкости по сравнению с другими системами сеток, потому что она дает вам выбор в использовании любого количества столбцов, которые вам нужны. Попрощайтесь с диктаторскими ограничениями 12-колоночных и 16-колоночных систем. 

rwdgrid

rwdgrid — адаптивная сетка CSS, которая основана на 960 Grid System.

CSS Smart Grid

CSS Smart Grid опирается на 960 Grid System. Весит всего 1.2KB.

Gridlock

Gridlock — адаптивная сетка, которая дает возможность дизайнерам и разработчикам производить продукт, который соответствует целевому устройству. Имеет три различных размера сетки, которые соответствуют конкретным размерам экрана: рабочий стол, планшетные и мобильные устройства.  

Перевод — Дежурка

Автор Jacob Gube

Читайте также:




Комментарии

  1. Xtray
    Thumb up Thumb down +1

    Есть еще такой сервис: gridpak.com

    :)

  2. антошо
    Thumb up Thumb down 0

    почему самые попсовые не упомянули? 960gs и blueprint?

  3. Tiger
    Thumb up Thumb down 0

    Дорогие наши читатели, спасибо за Ваши комментарии.

    Автор данной подборки — Jacob Gube.

    Мы обязательно упомянем желаемые Вами сетки в следующей подборке на эту тему, непосредственно от Дежурки.