POST - Como deixar as bordas arredondas, incluindo o Internet Explo

Vou ensinar como fazer bordas arredondas para todos os navegadores.

Adicionado em: 20/07/2012 16:34:23 | Total de visitas: 8428

Saudações galera da rede.

Hoje vamos aprender como fazer bordas arredondadas.

Vamos aprender como fazer  bordas em arredondadas em todos os navegadores inclusive o temido Internet Explorer.

Todo mundo quer sempre colocar bordas redondas, até porque é mais bonita e não precisa colocar imagens para arredondar as bordas, evitando assim, que a paginas demore a carregar em conexões lentas.

Agora vamos aprender a colocar bordas em círculos normais e depois em imagens.

Para círculos normais:

#box{ --------------------à Nome da Div

width:500px; -----------------------à Largura

height:500px; ----------------------à Altura

border:1px solid #090; ---------à Borda(1px àEspesura da borda, solid à tipo de borda, #090 à cor da borda.

-moz-border-radius:5px; ----à esta borda tem que ser utilizada para funcione no Mozilla

-webkit-border-radius:5px; --à esta borda é para o temido Internet Explorer

border-radius:5px; -----------à esta borda é para o Chrome e outros navegadores

}

Aprendemos como criar bordas arredondas normal, agora vamos aprender como criar bordas para as imagens, ou seja, arredondar as imagens.

#box img{ -----------------à o IMG significa que você estar atacando a imagem

-moz-border-radius:5px; ----à esta borda tem que ser utilizada para funcione no Mozilla

-webkit-border-radius:5px; --à esta borda é para o temido Internet Explorer

border-radius:5px; -----------à esta borda é para o Chrome e outros navegadores

}

 

OBS: Lembre-se, você pode colocar uma borda na imagem adicionando apenas o border:1px solid #CCC.

OBS1: Nos outros posts vou ensinar como arredondar somente um lado da imagem ou quadrado.

Espero que tenham gostado.

Até a próxima.

Tem alguma dúvida, algum elógio ou alguma sugestão?

Deixe seu comentário. Seu comentário é que me motiva a escrever!

Tem alguma dúvida, elógio ou sugestão sobre esta vídeo aula?
Deixe seu comentário

Para deixar seu comentário, é preciso que você esteja logado no site.
Faça seu login ou se cadastre em nosso portal.
Clique aqui para fazer seu login

Comentários enviados do site

**//Ainda não existe comentário para este POST, gostária de ser o primeiro?

Comentário via Facebook

ads from our partners Nosso shopping

Marc Rodress - Seu Portal de Programação LTDA - Copyright - Todos os direitos reservados a Business Marc - 2011 - 2019 Politicas de Privacidade