Popnoid.com/ETC » Bordas Arredondadas
 

Bordas Arredondadas

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.