WebCis - Serviços de criação sites, marketing digital e sistemas web.

SIGA-NOS
Solicite um orçamento

Dicas para Criação e de sites

Cantos e bordas arredondados com CSS3

Publicidade

Criando cantos arredondados com CSS3

Informação: Essa função CSS3 funciona perfeitamente nos navegadores Internet Explorer 9, Google Chrome, Mozila Firefox e Safari.

​Cada um desses navegadores precisará de um prefixo para que funcione, lembrando que esse prefixo será temporário até que o W3C valide os comandos CSS3. 

Lista com prefixo de cada navegador
Mozilla Firefox: -moz-
Google Chrome e Safari: -webkit-
Opera: -o-
Internet Explorer: -ms-

Vamos ao exemplo de BORDER RADIUS

Obs: Irei mensionar apenas os pefixos dos navegadores mais usados, é importante colocar o comando também sem os prefixos como no exemplo, pois assim que os mesmos forem validados seu código ainda funcionará.

.teste {
background:#333;
width:450px;
margin: auto;
padding:10px;
text-align:center;

-moz-border-radius:7px;
-webkit-border-radius:7px;
 border-radius:7px;
}

Coloque as informações de border-radius na no ID ou class da div que desejar que fique com as bordas arredondadas:

Veja o Resultado:
 

DIV COM CANTOS ARREDONDADAS
Publicidade
Postado por: Claudio I. Santos
Projetos e Tecnologia

 

Assine nosso feeds e receba notícias todas semanas

Últimos Clientes

[veja todos]