10 легких альтернатив Bootstrap & Foundation
Выбор подходящего фреймворка, который идеально подходит для ваших проектов, может быть немного ошеломляющим - есть из чего выбирать. Возможно, вы захотите выбрать популярные варианты, такие как Bootstrap или Foundation, но если ваш сайт будет довольно простым, вам не понадобится большинство строительных блоков и материалов включен в пакет по умолчанию.
Хорошая новость заключается в том, что есть несколько альтернатив, которые значительно уступают Bootstrap или Foundation. Большинство из этих платформ поставляются с только правильное количество стилей и компонентов чтобы помочь вам начать работу, позволяя вам расширять их в нужном вам направлении для вашего проекта.
Вот 10 легких альтернатив Bootstrap и Foundation что вы должны использовать для создание небольших сайтов.
Больше на Hongkiat.com:
- Начало работы с Twitter Bootstrap
- Использование Bootstrap 3 с Sass
- Инструмент начальной загрузки: создание макетов начальной загрузки HTML
- Работа с плагином Bootstrap: модальное окно
- Bootstrap Tool: создайте мегаменю с YAMM3
1. Скелет
Скелет наконец-то получил подтяжку лица. Это полная реконструкция с нуля, и все же она все еще такая же легкая, как и раньше. Новая сеточная система Skeleton теперь использует философию, ориентированную на мобильные устройства, которая гарантирует, что макет занимает центральное место независимо от того, насколько мал экран устройства.
Все компоненты, которые были включены в более раннюю версию - кнопки, формы и элементы ввода - все еще присутствуют, но основные стили оформления теперь установлены в рем
единица измерения.
2. CardinalCSS
CardinalCSS - это CSS-фреймворк, построенный с акцентом на производительность, удобочитаемость и, самое главное, удобство обслуживания CardinalCSS использует некоторые современные подходы, такие как mobile-first, для формирования сетки; и CSS Box Model, которая позволяет легко определять ширину и высоту элемента.
CardinalCSS также поставляется с несколькими вспомогательными классами, которые позволяют быстро применять стили к элементу, например, буквицы
который применяет эффект буквицы для первого символа в абзаце.
3. ConciseCSS
ConciseCSS - это фреймворк CSS - без раздувания. Это компактный фреймворк, построенный на основе Sass, LESS и Stylus, который прокладывает свой золотой путь к удобству сопровождения CSS. Но, если вы предпочитаете простой простой ванильный CSS, вы также можете иметь это.
Точно так же ConciseCSS также поставляется с базовыми стилями для основных элементов, таких как заголовки, абзацы, таблицы, формы и набор классов помощников для создания пользовательского интерфейса кнопки..
4. PowertoCSS
PowertoCSS - это легкий и прочный каркас внешнего интерфейса. Имена классов, которые используются для построения сетки и применения стилей, просты и легко запоминаются, например,. .кнопка
. Вы также можете добавить свою собственную тему. Отправляйтесь в их StarterKit, чтобы начать.
5. Сильный
Furtive - это CSS-фреймворк для мобильных устройств, созданный на основе передовых веб-стандартов, таких как использование Flexbox для сетки и рем
блок для определения размеров элементов (включая размер шрифта). Furtive сохраняет небольшой размер CSS, не поддерживая старые браузеры (* cough * Internet Explorer), поскольку они требуют некоторого взлома CSS. Следовательно, Furtive является идеальной основой, если вы разрабатываете сайт для будущего.
6. BassCSS
BassCSS предлагает легкий набор стилей базовых элементов, утилит, макетов и стилей цвета в модульной форме для создания адаптивного веб-приложения. Файлы SCSS включены, чтобы легко настроить стиль. Вы можете играть с типографикой, пробелами, точками останова и элементами пользовательского интерфейса.
7. Мюллер
Mueller - это модульная адаптивная сеточная система, построенная на основе Sass и Compass. С помощью Мюллера вы можете построить сетку, добавив классы прямо к элементам HTML, или, если вы предпочитаете, чтобы элементы HTML были аккуратными и чистыми, используя Сетка ()
функция. Сетка Мюллера может использоваться совместно с библиотекой Masonry Javascript для создания макета в стиле Pinterest.
8. Туктук
Tuktuk - это уникальное имя для фреймворка. По сравнению с Bootstrap или Foundation, Tuktuk намного легче, поскольку в него входит только необходимое количество компонентов для создания презентабельного веб-сайта, в том числе для системы сетки, базовых стилей для типографики, таблиц и нескольких пользовательских интерфейсов, таких как navbar и модальности.
9. База
База построена на основе LESS и Sass и включает в себя только самые важные компоненты для создания веб-сайтов: сетку и базовое оформление элементов HTML. Base не поставляется с компонентами Javascript, но обеспечивает большую совместимость с браузером, так что работает даже с IE7.
10. Тост
Последний из нашего списка - Тост. С помощью таблицы стилей SCSS, включенной в пакет, Toast позволяет легко настраивать имена классов сетки, желоб и даже базу столбцов. Например, если вы хотите, чтобы сетка состояла из 9 базовых столбцов вместо 12, вы можете сделать это. Toast - это минимальный CSS-фреймворк с очень гибкими конфигурациями, удовлетворяющими вашим требованиям..