Tendencias na web e novas tecnologias

Como já mostramos antes, é possível obter efeitos úteis e legais usando somente o CSS. No post anterior vimos como criar um simples Efeito de Rollover com CSS, e neste post vamos aprender a montar uma Galeria de Fotos usando apenas o CSS.

Aviso que é uma galeria simples, com um resultado bonito, mas que apresenta apenas fins decorativos, como em um banner ou em algum outro lugar onde sua criatividade puder fazer uso dela. Então, vamos lá.

1. Primeiro, veja como é o HTML da nossa galeria.

<ul id="css-gallery">
<li><a href="#" title="Wanted - Adalberto">
<img src="http://www.comunicaweb.com.br/blog/wp-content/themes/
BrownMagic/images/posts/09/css-galery-adalberto-small.jpg" alt="Wanted -
Adalberto" title="Wanted - Adalberto" /></a></li>
<li><a href="#" title="Wanted - Mariane">
<img src="http://www.comunicaweb.com.br/blog/wp-content/themes/
BrownMagic/images/posts/09/css-galery-mariane-small.jpg" alt="Wanted -
Mariane" title="Wanted - Mariane" /></a></li>
<li><a href="#" title="Wanted - Leonardo">
<img src="http://www.comunicaweb.com.br/blog/wp-content/themes/
BrownMagic/images/posts/09/css-galery-leonardo-small.jpg" alt="Wanted -
Leonardo" title="Wanted - Leonardo" /></a></li>
<li><a href="#" title="Wanted - Sodré">
<img src="http://www.comunicaweb.com.br/blog/wp-content/themes/
BrownMagic/images/posts/09/css-galery-sodre-small.jpg" alt="Wanted -
Sodré" title="Wanted - Sodré" /></a></li>
</ul>

Leia o resto deste post »