Доверьте продвижение нам

Комментарии

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *

от 1 499 098 

Как сделать кнопку градиентом css

Views Icon4

Чтобы создать кнопку с градиентным фоном в CSS, можно использовать свойства background и linear-gradient.

Например, чтобы создать кнопку с градиентным фоном, можно использовать следующий код:

HTML:

<button class="gradient-button">Кнопка с градиентом</button>

CSS:

.gradient-button {
  background: linear-gradient(to bottom, #2196f3, #008CBA); /* добавляем градиентный фон */
  color: #fff; /* задаем цвет текста на кнопке */
  padding: 10px 20px; /* добавляем отступы внутри кнопки */
  border: none; /* убираем рамку кнопки */
  border-radius: 5px; /* задаем скругление углов кнопки */
  cursor: pointer; /* меняем курсор при наведении на кнопку */
}

Сначала мы создаем кнопку с классом gradient-button. Затем, добавляем свойство background со значением linear-gradient, которое позволяет создать градиентный фон. Мы используем значения #2196f3 и #008CBA для создания градиента, который идет от голубого к темно-синему сверху вниз.

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

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

Поделиться:

Задать вопрос

Оставляя заявку, вы соглашаетесь с политикой обработки персональных данных.

Оставить заявку

Оставляя заявку, вы соглашаетесь с политикой обработки персональных данных.