Vuetify

Магазин

Для бизнеса

Компонент v-btn заменяет кнопку стандартного html темой material design и множеством опций. Для изменения цвета фона или текста можно использовать любой класс цвета.

Кнопки в их стандартной форме содержат текст верхнего регистра, небольшую elevation, hover эффект и ripple эффект при нажатии.

Options

Выберите нужный компонент ниже и посмотрите доступные параметры, слоты, события и функции.

Ниже приведена коллекция простых и сложных примеров.

Text buttons have no box shadow and no background. Only on hover is the container for the button shown.

Обычные кнопки имеют тень, которая увеличивается при нажатии. Это стиль по умолчанию.

Нажатые кнопки по-прежнему сохраняют свой цвет фона, но не имеют тени.

Выпадающие кнопки являются стандартным выбором с дополнительным стилем.

Иконки могут использоваться для основного содержимого кнопки.

Плавающие кнопки закруглены и, как правило, содержат иконку.

Кнопкам можно задавать различные размеры.

Контурные кнопки наследуют свои границы от текущего примененного цвета.

Скругленные кнопки ведут себя так же, как и обычные кнопки, но имеют закругленные края.

Tile buttons behave the same as regular buttons but have no border radius.

Кнопки данного типа используют всю доступную ширину.

Используя загрузку, вы можете уведомить пользователя о том, что происходит обработка. По умолчанию используется компонент v-progress-circle, но это можно настроить.

Готовы к большему? Продолжить чтение с:

Caught a mistake or want to contribute to the documentation? Edit Layout on GitHub!