Form компонент - UIkit документация на български език
Лесно е да създавате форми с различни оформления и стилове, които ще изглеждат страхотно.
Използване
За да инсталирате този компонент, добавете класа .uk-form към елемента form. Всички формуляри, контроли се поставят един до друг в рамките на следващия ред.
Забележка В този пример сме използвали бутон от компонент на бутон. За да добавите горно поле за елементи на формуляр, когато са подредени в малки прозорци за изглед, просто добавете атрибута data-uk-margin от компонента Utility към родителския елемент.
Контролни състояния
Осигурете на потребителя основна информация чрез обратна връзка за състоянието на контролите на формуляра.
Добавете атрибута disabled към контролата на формуляра и той ще изглежда заглушен.
Проверете щатите
Добавете клас .uk-form-danger или .uk-form-success към контролата на формуляра, за да уведомите потребителя дали дадена стойност се проверява или не.
Контролни модификатори
Модификатори на размера
Добавете клас .uk-form-large или .uk-form-small към , или
Модификатори на маркиране
Има две безплатни модификаторни маркировки: .uk-form-stacked и .uk-form-horizontal. И двете изискват контроли на формуляри, обвити с класа .uk-form-row, за да ги стекат. Етикетите се нуждаят от клас .uk-form-label, а контролите трябва да бъдат обвити в клас .uk-form-controls.
Забележка Към елемент могат да се добавят и модификатори за маркиране. Това означава, че ако използвате набори от полета, можете да имате различни маркировки на формуляри за всеки набор от полета.
Форма натрупана
Добавете .uk-form-stacked клас за показване на етикети в горната част на контролата.
Форми на хоризонтала
Добавете .uk-form-horizontalклас за показване на етикети и контроли един до друг.
Текст в контролите на формуляра
Ако използвате текст и квадратчета за отметка или радио бутони във вашите контроли на формуляра, просто добавете класа .uk-form-controls-text, за да подравните правилно текста.
Вертикално разстояние в контролите на формуляра
Ако създавате елементи в контроли на формуляр, добавете класа .uk-form-controls-condensed, за да съкратите разстоянието.
Форма и мрежа
Това е пример как да използвате формуляри с компонента Grid.
Форма и икони
Това е пример за това как да добавите икона от компонент на икона към формуляр.
Разширена форма
Формулярът може да бъде разширен с помощта на параметъра Form на компонента за разширен стил на радио и входове в полето за отметка.
Направено от YOOtheme С любов и кофеин. Под лиценза на MIT.