При добавлении кнопки на веб-страницу рекомендуется использовать CSS для создания ее стиля. Использование CSS является предпочтительным методом, так как это более эффективный и организованный способ хранения кода стиля для повторного использования в более чем одной области на вашей странице или сайте. Как видно из приведенного ниже примера, для управления каждым типом кнопок можно использовать множество атрибутов.
CSS текст для стиля кнопок
#Разместить {
цвет фона: #bbb;
набивка: .5em;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
радиус границы: 6 пикселей;
цвет: #fff;
семейство шрифтов: «Освальд»;
размер шрифта: 20 пикселей;
текстовое оформление: нет;
граница: нет;
}
#submit: hover {
граница: нет;
фон: оранжевый;
тень от рамки: 0px 0px 1px # 777;
}
HTML-код для создания кнопки
После добавления CSS на страницу этот CSS можно применить к любой кнопке, используя код в HTML.
Пример кнопки
Пример кнопки, созданной CSS
Пример кнопки
Из приведенного выше примера видно, что когда мышь не находится над кнопкой, кнопка имеет светло-серый фон и белый текст. При наведении курсора мыши на кнопку фон меняется на оранжевый. Кроме того, углы кнопки округляются, а не возводятся в квадрат, как стандартная кнопка формы.
