@Persocon

Reset.CSS

Faz algum tempo, venho pensando em escrever sobre o famoso método de Reset CSS que Eric Meyer criou, é um método incrivel, que uso a bastante tempo em alguns sites.

Para que serve o Reset CSS afinal?

Simples, ele remove todos tipos de Styles possiveis de todos elementos possiveis desde a até var.

Por que usa-lo?

Todos browsers modernos seguem padrões para CSS, alguns nem tanto IEs da vida, e por causa desses nem tanto, sofremos com diversos problemas, como por exemplo, bugs de Float, de faltar ou sobrar “meio” pixel, tamanho de fonte, entre outros.

Com o Reset, simplificamos tudo isso, começamos tudo do zero, assim em TODOS os browsers as configurações serão as mesmas.

Claro que isso aumenta um pouco o load, em alguns sites, como grandes portais isso pode ser um problemão, este seria o unico contra de usar o Reset.

Como usa-lo?

Para usa-lo é simples, você deve simplesmente copiar isto:

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	font-family: inherit;
	vertical-align: baseline;
}
/* remember to define focus styles! */
:focus {
	outline: 0;
}
body {
	line-height: 1;
	color: black;
	background: white;
}
ol, ul {
	list-style: none;
}
/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: separate;
	border-spacing: 0;
}
caption, th, td {
	text-align: left;
	font-weight: normal;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: "";
}
blockquote, q {
	quotes: "" "";
}

Para um arquivo reset.css e inclui-lo no seu codigo da seguinte maneira:

<link rel="stylesheet" type="text/css" href="reset.css" />

Feito isso, o Reset já deve estar funcionando perfeitamente.

Para um proximo post, falarei sobre a técnica de Base CSS que detona esse problema de Load e estou gostando ainda mais de usar. Aguardem

Sobre Pedro Costa Neves

Webdesigner, Wordpress Ninja, fundador do http://persocon.org e do http://geek-candy.com. Sócio, Co-fundador, Diretor de Arte, Web Developer em !Drop Studio e está procurando emprego em Chapecó se alguem souber avise-me. Você pode entrar em contato comigo através da página de contato neste site ou pelo email neo[at]persocon.org.