O CSS vem se difundindo cada vez mais entre os desenvolvedores web. Na primeira vez que aprendi, juro que pensei: “Que coisa inútil” mas hoje não consigo fazer nada na web sem utilizar CSS. Desenvolver em CSS oferece diversas vantagens, como fazer um site completamente sem tabelas, o que já é uma boa otimização pros buscadores (SEO), e o mais importante é que separa o layout da programação e da informação do site, tornando muito mais fácil a modificação de temas e layout de uma página.

Eu sempre vejo inúmeros artigos sobre CSS, e até indico um ótimo site que inclusive, é do professor da empresa onde aprendi realmente o início do CSS e a utilizar Tableless, o site Tableless.

E como o CSS chegou para ajudar, mostro abaixo 53 técnicas de CSS muito boas e que facilitam bastante a vida de qualquer desenvolvedor. Achado no Smashing Magazine, um dos melhores sites de design que conheço.

1. Menu em CSS

2. Navegação Matrix Reloaded

3. Abas em CSS

4. Gráfico de Barras em CSS (CSS For Bar Graphs)

5. Tabelas que se abrem

6. Método Adams de customização de Radio e Checkbox

7. CSS Image Replacement

8. Sombras com CSS (CSS Shadows Roundup)

9. Cantos redondos em CSS (Nifty Corners)

10. Drop Cap – Letras iniciais maiores em CSS

11. Definir opacidade da imagem com CSS

12. Como criar um efeito HOVER numa lista de blocos de links

13. Citações em CSS (Citações automáticas com JavaScript e CSS)

14. Diagramas em CSS

15. Curvas com CSS

16. Footer Stick permite que o rodapé da página apareça tanto no final da janela do browser como no final do conteúdo da página.

17. CSS Image Map

18. CSS Image Pop-Up

19. CSS Image Preloader

20. CSS Image Replacement para botões

21. Thumbnail para links

22. CSS Map Pop

23. Troca de folha de estilo baseada em PHP

24. Calendário CSS com lista não ordenada (CSS Styled Calender)

25. Técnicas de formulários em CSS

26. Técnicas de tabelas em CSS:

27. Imprimindo documentos Web em CSS

28. Melhorando o design de como os links são mostrados para impressão com CSS

29. Botões Submit em CSS

30. CSS Teaser Box

31. Dicas de marcadores personalizados em CSS

32. Ticked Off Links Reloaded

33. Zoom com CSS

34. Criando uma votação com estrelas usando CSS

35. Modos de estilizar links visitados

36. Estilizando links para arquivos PDF, ZIP, DOC

37. Displaying Percentages with CSS

38. Image Floats sem moldar o texto

39. Deixe o visitante escolher se quer abrir o link em uma nova janela

40. Acessando links externos facilmente

41. Tabela zebrada com JavaScript e CSS

42. Alinhamento central com CSS (Horizontal e Vertical)

43. Notas de páginas não intrusivas

44. Legenda de imagens com CSS (Styled Images com legenda)

45. Gráfico de torta dinâmico com CSS

46. Notas de rodapé  com CSS

47. Sitemaps hierárquicos com CSS

48. Snook’s Resizable Underlines

49. Switchy McLayout: Técnica de adaptação de layout

50. StyleMap: CSS+HTML Visual Sitemap

51. Tamanho personalizado de leitura

52. Mensagem de alerta em CSS

53. CSS Production Notes