Ядро

Все основные компоненты UIkit как на ладони.

UIkit предлагает более 30 модульных, расширяемых компонентов, которые можно комбинировать друг с другом. Компоненты находятся в различных разделах в зависимости от их предназначения и функций.

По умолчанию

Эти компоненты, как правило, нормализуют HTML-элементы для кросс-браузерной функциональности и добавляют базовую стилизацию.

Разметка

Примените нашу полностью гибко реагирующую сеточную систему и панели, распространенные компоненты макета, такие как статьи блогов, комментарии и классы полезных утилит.

Навигация

UIkit предоставляет различные способы навигации, такие, как навигационные и боковые панели. Используйте breadcrumbs или пагинацию для перемещения по тексту статьи.

Элементы

Стиль основные элементы HTML, как таблицы и формы. Эти компоненты использовать свои собственные классы. Они не будут мешать какие-умолчанию элемент стайлинга.

Общие

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

JavaScript

Эти компоненты опираются в основном на JavaScript угасать в скрытый контент, вроде выпадающих меню, модальные диалоги, off-холст баров и всплывающие подсказки.


Точки прерывания

UIkit содержит количество aдаптивный классов в стиле вашего контента для просмотра различной ширины. Эта Таблица дает вам краткий обзор существующих точек останова и связанные с ними устройства. Вы можете настроить все точки останова через Настройщик.

Размер Точки останова Устройство
Mini up to 479px Телефоны портрет
Small 480px to 767px Телефоны пейзаж
Medium 768px to 959px Планшеты портрет
Large 960px to 1199px Рабочие столы & планшеты пейзаж
Xlarge 1200px and larger Большие Рабочие Столы

CSS архитектура

Чтобы избежать конфликтов с другими CSS рамок, все UIkit классы название интервал с uk- префикс. Компоненты подразделяются на сам компонент, суб-объекты и модификаторы, чьи имена классов всегда подобрать имя компонента.

Определения

Объект Описание
Component Компоненты абстрактных повторяющихся частей сайта в класс на основе модулей, как кнопки например. Это могут быть повторно использованы и в сочетании.
Sub-object Суб-объекты размещаются внутри компонента, чтобы повысить его функциональные возможности, например кнопка закрытия окна в окно с предупреждением.
Modifier Модификатор классов, изменить стиль компонентов и их подобъекты, кнопка "мне нравится" цветов и размеров.