Я хочу простую в использовании сетку для моего текущего веб-проекта. Это те функции, которые я бы оценил:
- раскладка флюида: поля, которые могут быть выровнены по горизонтали (бок о бок), каждая из которых имеет одинаковую высоту (например, трехколоночный макет), работая со 100% шириной
- отзывчивость: автоматически адаптируется при изменении размера окна браузера.
- мобильные устройства: показывает альтернативный макет размещения для пэдов и мобильных телефонов.
- размер текста: возможность динамического изменения размеров текста (например, заголовки с полной шириной)
- размер изображения: возможность динамического изменения размеров изображений (например, галереи изображений полной ширины)
- точки останова: необязательно определять значения ширины, которые вызывают события, которые изменяют компоновку (например, удаление кнопок, если ширина падает ниже порогового значения)
Update
Я нашел много сеток, но сузил его до следующих трех перспективных фреймворков, которые могли бы хорошо соответствовать моим требованиям:
Вот все остальные:
-
CSS-сетка(не текучая) -
320 и Вверх(не текучая) -
Columnal(не текучий) -
Skeleton(не текучий) -
SimpleGrid(не текучий) -
Less Framework(не текучая) -
Bootstrap(не семантические классы) -
Breakpoints.js(только точки останова, похожие на медиа-запросы) -
Адаптивные изображения(только изображения) -
FitText(только текст) -
Gridset(коммерческий) -
HTML5 Boilerplate(старый)
Обычно я сам тестировал их, прежде чем спрашивать здесь, чтобы я мог сформулировать более конкретные вопросы. Но из-за огромного количества фреймворков я хотел бы услышать некоторые указания, с чего начать.
- Как ваш опыт с этими или другими подобными структурами?
- Вы рекомендуете конкретную структуру, которая соответствует моим требованиям?
Решение
Я закончил использование Foundation
, что, безусловно, является победителем в этой гонке - по моему скромному мнению.
Обновление 2
Bootstrap 3 - настоящая конкуренция, потому что она также поддерживает семантические классы сетки. И он поддерживает SASS, а также LESS.