CSS Button: Design Customizable and Stylish Website Buttons
CSS кнопка - это стилизованный элемент HTML, который создается с помощью CSS. Кнопки могут обладать различными свойствами, такими как цвет, фон, размер, форма, а также эффекты наведения и нажатия.
Пример кода CSS кнопки:
HTML:
html
CSS:
css
.btn {
background-color: blue;
color: white;
border: none;
padding: 10px 20px;
font-size: 16px;
border-radius: 5px;
cursor: pointer;
}
.btn:hover {
background-color: lightblue;
}
.btn:active {
background-color: darkblue;
}
В этом примере CSS кнопка имеет синий фон и белый текст, а также имеет за скругление углов. Она также имеет эффекты наведения и нажатия при помощи псевдоклассов :hover и :active соответственно.
CSS кнопки могут быть созданы с помощью различных CSS свойств и сочетаний. Некоторые из них:
1. background-color - задает цвет фона кнопки.
2. color - задает цвет текста кнопки.
3. border - задает размер, стиль и цвет границы кнопки.
4. padding - задает отступ вокруг текста кнопки.
5. font-size - задает размер шрифта текста кнопки.
6. border-radius - задает радиус скругления углов кнопки.
7. cursor - задает тип курсора при наведении на кнопку.
Также можно использовать CSS фреймворки, такие как Bootstrap или Materialize, чтобы быстро и легко создать стилизованные кнопки с помощью готовых CSS классов.