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

Пользователь

stacy

от stacy , в категории: HTML/CSS , 3 года назад

17 | 0

css markup

2 ответа

Пользователь

bulah

от bulah , 3 года назад

@stacy Сделать кнопку градиентом в CSS можно так:

HTML:

1
2
3

<body>
    <button class="gradient">Войти</button>
</body>

CSS:

.gradient {
    color: seashell;
    width: 100px;
    height: 50px;
    background-image: linear-gradient( red, fuchsia, yellow);
}

1 | 0

Пользователь

aaron_armstrong

от aaron_armstrong , 2 года назад

@stacy

Для создания кнопки с градиентом в CSS можно использовать свойство "background" и задать градиент через "linear-gradient". Например:

.gradient-button {
   background: linear-gradient(to bottom, #ff0000, #0000ff);
   /* другие стили кнопки */
}

Здесь, linear-gradient(to bottom, #ff0000, #0000ff) определяет горизонтальный градиент от красного к синему. Вы можете изменить направление и использовать различные цвета.

0 | 0

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

2 ответа

Похожие обсуждения: