José Carlos Web Designer | Freelancer

Simulador de navegador mobile

Hoje o Rodrigo me passou um link muito interessante, que é um site que mostra como seu site será exibido nos navegadores mobile.

O site é o Mowser, você só precisa colocar o endereço do seu site e clicar em “go”.

Veja como ficou o meu site.

Ps. Lembre-se que o link abrirá na mesma janela, para abrir em outra clique com o botão direito do mouse e selecione “abrir link em uma nova janela”.

CSS Quiz

Um quiz muito interessante para você que trabalha com css, é para saber quantas propriedades você lembra em 7 minutos, o meu resultado é esse:

47

Clique no banner e faça você, poste aqui o seu resultado se quiser.

Retirar o pontilhado dos links

Este código é muito útil, por exemplo quando usamos um menu que tem uma imagem e um texto com indent, quando é clicado aparece o pontilhado do botão até o final da página. Para evitar isso utilize o seguinte código no seu arquivo CSS.
(mais…)

Resetar CSS #2

Como foi lembrado pelo João Paulo (amigo e professor) existe também outro caminho para resetar todos os atributos com um seletor “curinga” que para todos os navegadores, seria a seguinte forma:

* {
margin: 0;
padding: 0;
border: 0;
}

Esse é mais um caminho que pode ser seguido, esse método também é validado pelo w3c.

Resetar CSS

Um código bastante simples e útil para zerar os valores de todos os seletores do CSS, diminuindo assim a quantidade de CSS Hacks a serem utilizadas:

body,div,dl,dt,dd,ul,ol,li{margin:0;padding:0;}
h1,h2,h3,h4,h5,h6{margin:0;padding:0;}
pre,form,fieldset,p,blockquote{margin:0;padding:0;}
th,td{margin:0;padding:0;}
address,th{font-style:normal;font-weight:normal;}
table{border-collapse:collapse;border-spacing:0;}
caption,th{text-align:left;}
img,fieldset{border:none;}
ol,ul{list-style:none;}

Utilizando CSS Hacks e validando o código

Nós webdesigners sempre deparamos com problemas de renderização, para contornar esse problema existe um código que é uma condicional, interpretada pelo IE apartir da versão 5.0:

<!--[if lte IE 6]>
Texto visível se o IE for menor ou igual ao IE 6
<![endif]-->

(mais…)

CheatSheets

Cheat Sheet, é uma folha do tamanho A4 para uma rápida consulta, seguem 3 Cheat Sheets:

• CSS Cheat Sheet (PNG / PDF)
• JavaScript Cheat Sheet (PNG / PDF)
• XHTML Cheat Sheet (PNG / PDF)

fonte: www.ilovejackdaniels.com