Адаптивные системы сеток
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
Читайте также:
- Создаем адаптивный css-таймлайн с 3d эффектом
- Создаем веб-ленту в Adobe Photoshop
- CSS-фреймворки для адаптивного дизайна
27 августа 2013 в 10:26
Есть еще такой сервис: gridpak.com
27 августа 2013 в 16:10
почему самые попсовые не упомянули? 960gs и blueprint?
28 августа 2013 в 9:23
Дорогие наши читатели, спасибо за Ваши комментарии.
Автор данной подборки — Jacob Gube.
Мы обязательно упомянем желаемые Вами сетки в следующей подборке на эту тему, непосредственно от Дежурки.