helldanger1
GForum VIP
- Entrou
- Ago 1, 2007
- Mensagens
- 29,631
- Gostos Recebidos
- 1
Outro exemplo de caixa realizada com CSS no qual temos uma linha de 2 pixels de largura que rodeia o conteúdo. A linha tem esquinas arredondadas.
Por Miguel Angel Alvarez - Tradução de JML
Vamos realizar uma caixa com CSS, no temos uma linha que faz a borda, toda ao redor da caixa, com as esquinas arredondadas.
Trata-se de um exemplo um pouco mais sofisticado, que mudando as imagens, nos permitirá fazer mais variedade de caixas. Este exercício está baseado em um artigo precedente que deve ser lido antes, chamado caixa com CSS para colocar conteúdo.
Antes de começar, também podemos ver o exemplo que vamos realizar.
Para realizar este exercício vamos precisar de três camadas com três imagens que vamos colocar de fundo. As camadas e imagens serão colocadas acima, para criar os arredondados superiores, no meio, para criar a borda do meio e a camada de baixo, para criar os arredondados inferiores.
A camada do meio deve crescer mais ou menos dependendo do conteúdo que tivermos incluído dentro da caixa, quanto mais conteúdo tiver, maior será a camada.
Por Miguel Angel Alvarez - Tradução de JML
Vamos realizar uma caixa com CSS, no temos uma linha que faz a borda, toda ao redor da caixa, com as esquinas arredondadas.
Trata-se de um exemplo um pouco mais sofisticado, que mudando as imagens, nos permitirá fazer mais variedade de caixas. Este exercício está baseado em um artigo precedente que deve ser lido antes, chamado caixa com CSS para colocar conteúdo.
Antes de começar, também podemos ver o exemplo que vamos realizar.
Para realizar este exercício vamos precisar de três camadas com três imagens que vamos colocar de fundo. As camadas e imagens serão colocadas acima, para criar os arredondados superiores, no meio, para criar a borda do meio e a camada de baixo, para criar os arredondados inferiores.
A camada do meio deve crescer mais ou menos dependendo do conteúdo que tivermos incluído dentro da caixa, quanto mais conteúdo tiver, maior será a camada.