Здесь перечислены другие основные классы, которые вы можете использовать для достижения необходимых результатов. Сюда входят классы, которые, так или иначе, не были перечислены в других документах CSS фреймворка.
Внутренние поля (Padding)
ipsPad
15px отступа на ПК
ipsPad_half
7px отступа на ПК
ipsPad_double
30px отступа на ПК
Данные классы внутреннего отступа масштабируются соответствующим образом на мобильных устройствах.
Расстояние
ipsSpacer_top
15px отступа сверху (margin)
ipsSpacer_bottom
15px отступа снизу (margin)
ipsSpacer_both
15px отступа сверху и снизу (margin)
ipsSpacer_half
В сочетании с один из вышеперечисленных классов, уменьшает расстояние в два раза
ipsSpacer_double
В сочетании с один из вышеперечисленных классов, удваивает расстояние
Отмена обтекания (clear)
ipsClear
Отменяет обтекания предшествующего элемента, к которому применён этот класс.
ipsClearfix
Популярная техника 'clearfix', которая приводит к обёртыванию элемента, к которому применяется данный класс, а также элементов внутри него, даже если они плавающие. Данный класс должен быть применим ко всем элементам, где потомственные элементы могут быть плавающими.
Позиционирование
Для текстового позиционирования, смотрите Типографика (шрифты).
ipsPos_left
Выравнивает элемент по левому краю
ipsPos_right
Выравнивает элемент по правому краю
ipsPos_center
Устанавливает автоматические поля (margin) к элементу для его центрирования. Блочные элементы требуют указания ширины чтобы применился данный класс, иначе они будут отображены естественным образом с шириной в 100%.
Горизонтальная линия
Горизонтальные линии могут быть стилизованы путём добавления класса ipsHr к обычному элементу <hr>.
Счётчики уведомлений
Класс ipsNotificationCount предназначен для плавающего 'пузыря', который может означать количество уведомлений для чего-либо. Родительский элемент должен иметь не статическое положение для корректной работы данного класса. По умолчанию, 'пузырь' уведомления будет смещён вправо вверх, но это может быть изменено путём добавления дополнительных специфичных стилей, если это необходимо. Использование:
<a href='#' class='ipsButton ipsButton_primary ipsButton_medium' style='position:relative'> Кнопка с уведомлением <span class='<strong>ipsNotificationCount</strong>'>33</span> </a>
Будет отображено:
Статус В сети/Не в сети
Предоставляет простую стилизацию для обозначения статуса чего-либо (например пользователя) - в сети или не в сети. ipsOnlineStatus это основной класс; добавьте ipsOnlineStatus_online или ipsOnlineStatus_offline для обозначения актуального состояния.
<strong class='ipsOnlineStatus ipsOnlineStatus_online'><i class='fa fa-circle'></i> В сети</strong><br> <strong class='ipsOnlineStatus ipsOnlineStatus_offline'><i class='fa fa-circle'></i> Не в сети</strong>
Не в сети
Курсоры
Несколько классов, предназначенных для изменения курсора мыши на определённых элементах.
ipsCursor_locked
Курсор "Нет разрешения" (пример)
ipsCursor_drag
Показывает элемент, который может быть перемещён (пример)
ipsCursor_pointer
Показывает элемент, на который можно кликнуть (пример)
ipsCursor_help
Показывает элемент, предназначенный для помощи (пример)
ipsCursor_default
Устанавливает курсор в состояние по умолчанию (пример)