11 5563-9074
Orçamento

Cantos e bordas arredondados com CSS3

CSS - Aplicar cantos arredondados em div's utilizando CSS3
Publicidade

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 ARREDONDADOS
Publicidade
Autor: Claudio I. Santos
Projetos e Tecnologia