Чистые размеры кнопок CSS

Кнопки являются одним из наиболее распространенных элементов пользовательского интерфейса. Они позволили пользователям взаимодействовать с системой и действовать, делая выбор. Иногда нам требовались кнопки разного размера, вот и все, с помощью класса Pure CSS Button Size.

Чистый класс CSS Button Sizes: нет предопределенного класса для размера кнопки, мы должны сделать это с помощью CSS.

Процент размера кнопки зависит от родителя:

• button-xsmall: этот класс используется для создания очень маленьких кнопок (70%).
• button-small: этот класс используется для создания маленьких кнопок (85%).
• pure-button: этот класс используется для создания обычных кнопок.
• button-large: этот класс используется для создания больших кнопок (110%).
• button-xlarge: этот класс используется для создания очень больших кнопок (!25%).

Синтаксис:

<button class="button-xsmall pure-button">
   .....
</button>

Пример: пример ниже иллюстрирует размеры кнопок на чистом CSS.

Выход:

Ссылка на ссылку: https://purecss.io/buttons/