CSS (Cascading Style Sheets), web sayfalarında biçimlendirme ve tasarım işlemlerini yapmak için kullanılan bir dil olduğundan, CSS ile bir buton tasarımı yapmak mümkündür. Örneğin, aşağıdaki CSS kodu ile bir butona arka plan rengi kırmızı, yazı rengi beyaz ve yazı tipi Arial olarak ayarlayabilirsiniz:
button {
background-color: red;
color: white;
font-family: Arial;
}Bu kod, tüm <button> elementlerine uygulanacaktır ve arka plan rengini kırmızı, yazı rengini beyaz ve yazı tipini Arial olarak ayarlayacaktır. Eğer belirtilen butonu daha spesifik bir şekilde seçmek isterseniz, CSS seçicilerini kullanarak daha spesifik bir buton seçebilirsiniz. Örneğin, sadece id’si submit-button olan butona arka plan rengi kırmızı, yazı rengi beyaz ve yazı tipi Arial olarak ayarlamak için aşağıdaki kodu kullanabilirsiniz:
button#submit-button {
background-color: red;
color: white;
font-family: Arial;
}
Bu kod, sadece id’si submit-button olan <button> elementine uygulanacaktır ve arka plan rengini kırmızı, yazı rengini beyaz ve yazı tipini Arial olarak ayarlayacaktır. Eğer belirtilen butonun tasarımını daha fazla özelleştirmek isterseniz, CSS ile daha fazla stil seçeneği kullanabilirsiniz.