Botões e CSS

As Folhas de Estilos em Cascata (CSS) são sem dúvida uma das ferramentas mais úteis que podemos usar em nossas páginas web. Permite-nos definir o aspecto com o qual se apresentarão todos e cada um dos elementos de uma página web, conseguindo com isso a buscada separação entre dados e apresentação, tão buscada pelos desenvolvedores.

Mediante CSS podemos melhorar notavelmente o aspecto dos nossos botões de formulário, sempre e quando o navegador usado por nosso visitante suporte a aplicaão de estilos a estes elementos, ou seja, todos os navegadores de 5ª e 6ª geração.

Como exemplo, vamos modificar o aspecto externo do botão da página anterior, colocando um fundo azul, tirando o aspecto 3D e colocando o texto em branco, com fonte Verdana de 10 pixels. Também vamos definir seu tamanho exato. O código necessário será:

Cujo resultado é o seguinte:

Analisando um pouco o código anterior, vemos que definimos uma classe de estilo, .boton, que define os atributos desejados para nosso botão. A classe vem definida estabelecendo, dentro das etiquetas <style...>...</style> o nome da mesma precedido por um ponto, umas chaves e dentro delas os atributos desejados com seus valores.

Desta forma podemos fixar o aspecto concreto de nossos botões, tendo a liberdade para definir quantas classes necessitarmos.

Como vantagens deste método estão a total configuração de aspecto e que continuamos tendo um botão submit padrão (que ao clicarmos a tecla Enter serão enviados os dados do formulário). As desvantagens são que estas características de estilos para botões não são aceitas pelo Netscape 4x e que continuamos tendo a limitação de botões retangulares.