Repararam nas bordas arredondadas do meu formulário de comentários? Pode parecer que é uma imagem, mas nada mais é do que um código que, adicionado no seu CSS, deixa as bordas arredondadas. Pode ser usada em vários elementos, como formulários, botões, calendários… Pra isso, basta adicionar o seguinte código ao elemento que deseja deixar com as bordas arredondadas:
-moz-border-radius: 6px 6px 6px 6px;
Diminuindo os valores você obtém uma borda menos arredondada, e aumentando os valores você obtém uma borda cada vez mais arredondada. Eu uso 3px para a borda do meu formulário de comentários. =D
Exemplo
Para um formulário de comentários com bordas arredondadas, adicione o seguinte estilo ao seu CSS:
input {
border: 1px solid #FF0000;
background: #FFFFFF;
padding: 3px;
color: #000000;
font-family: Verdana, Arial;
font-size: 11px;
-moz-border-radius: 3px 3px 3px 3px;
}
Edite as cores como preferir e pronto!
Atenção: Não retire o tracinho na frente de “moz”, senão o código não funciona. Esse código funciona apenas em navegadores Mozilla, como o Firefox.
Ainda tem alguma dúvida? Então pergunte.
1,776 Views
