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]