- Главная
- Статьи и уроки
- Статьи о хостинге
- 10 библиотек SASS, которые помогут ускорить процесс разработки сайта
10 библиотек SASS, которые помогут ускорить процесс разработки сайта
SASS является одним из популярных CSS препроцессоров в настоящее время. Он дает разработчику при работе с таблицами стилей использовать такие инструменты как переменные, функции,, миксины, наследование и ветвление. Имеются сотни плагинов, библиотек и фреймворков для SASS, которые помогают уменьшить время разработки сайта.
В данной статье представлено 10 интересных библиотек SASS, которые стоят вашего внимания.
Gridlex
Gridlex – простая сетка css для разработки шаблонов и модулей. Её просто использовать. Достаточно обернуть вашу колонку (.col) контейнером сетки (.grid). Библиотека позволяет создавать адаптивный дизайн на основе медиа-запросов и поддерживает ветвление сетки непосредственно в колонке.
Buttons
Бесплатная библиотека SASS с открытым исходным кодом для создания настраиваемых кнопок. Позволяет быстро и просто делать отличные кнопки сочных расцветок для вашего сайта. В библиотеку включено большое количество стилей кнопок, включая варианты флат дизайна, со скругленными углами, 3D и другие.
Bourbon
Bourbon – простая легкая библиотека SASS для создания кросс-браузерных таблиц стилей. В неё включено почти всё, что нужно для разработки отличных сайтов — миксины, функции, дополнения. Библиотека совершенно независима и не требует конфигурации.
Sassy Inputs
Библиотека миксинов Sass для построения CSS3 стилей для форм ввода с минимальным размером и кросс-браузерностью. Включает миксины для создания полей для ввода текста, поиска, кнопок, чек-боксов, элементов выбора и радио кнопок. Sassy Inputs можно настроить. Для работы продуманы сочетания клавиш.
Saffron
Saffron - простая библиотека миксинов Sass для быстрого включения в ваш код анимаций и переходов для сайта. Библиотеку просто использовать. Нужно только добавить миксин в объявление и использовать переменную для включения желаемого эффекта. В библиотеку включено большое количество эффектов анимации и перходов состояния — затемнение, скольжение, подергивания и прочие.
mini.css
Легкий фреймворк для создания адаптивных вебсайтов. В сжатом виде занимает всего 10 Кб. Адаптивная сетка и набор компонентов позволяют быстро и просто реализовать любой дизайн для всех размеров экрана.
Angled Edges
Миксин Sass для создания скошенных граней на секции с помощью динамического SVG. В качестве фонового изображения создается векторный треугольник. Можно задавать его фоновый цвет, положение, заполнение, высоту, ширину и гипотенузу. Поддерживается всеми современными браузерами - Chrome, Firefox, Safari, Edge and including IE 9+.
Typesettings
С помощью Typesettings можно устанавливать размер шрифта для модульного масштаба в ems, вертикальный ритм и коэффициент адаптивности на основе базовой линии. По умолчанию. Размер базовой линии установлен в 6 px и поддерживается вертикальный ритм с рамками, выраженными в пикселях. Typesettings содержит всю математику для работы с ems и использует значения модульного масштаба для установки размера шрифта.
MaterializeCSS
Фреймворк для реализации дизайна в стиле материал. Его легко настроить и он адаптируется под разные размеры экрана. Во фреймворк включен большой набор компонентов — кнопки, карточки, формы, панели навигации, страничные переключатели и много другое. Совместим с браузерами Chrome, Firefox, Safari, Edge и IE 11+.
Include media
Библиотека Sass для быстрого создания медиа запросов. Содержит список переломных точек для смртфонов, планшетов и настольных компьютеров. Их легко настраивать, Можно писать медиа-запросы с использованием единиц em и rem, создавать псевдонимы для часто используемых выражений.
/_inc/images/articles/angled-edges.jpg
Источник: https:
Предложить идею урока:
Новости
QWINS.co представил бюджетный тарифный план на заказ виртуального сервера08 октября 2024, 12:51Коммутаторы Cisco на страже современных сетевых технологий
18 сентября 2024, 07:45WP 6.6 представит больше функций ИИ, разрушающих сеть
04 сентября 2024, 13:41FusionServer 2288H V5 02311XBK: решение сложных бизнес-задач и оптимизация IT-инфраструктуры
20 августа 2024, 13:35Аренда серверной стойки в дата-центре
20 августа 2024, 07:26