Que es un Reset CSS

Los navegadores web incluyen por defecto una hoja de estilos CSS predeterminada, de manera que si no indicamos ninguna propiedad, ellos tomarán la que tienen por defecto. Esto que a prior es una ventaja, puede convertirse en un tremendo inconveniente, ya que al no unificar estilos la misma pagina web puede mostrarse diferente en los distintos navegadores.

Por ello muchos diseñadores web han utilizado tecnicas para enmascarar las etiquetas CSS de los navegadores, lo que se conoce como Reset CSS.

Uno de los primeros códigos fue publicado Yahoo! UI Library, pero después vino la autentica revolución cuando Eric Meyer creó un Reset CSS que alcanzó gran popularidad gracias a los foros y blogs que publicaron su contenido.

El código en cuestión era el siguiente:

/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/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, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}

Básicamente consistía en forzar todas las propiedades a que no tuvieran valor (nulo o cero), de manera que si por ejemplo no se especificaba ningún margen, cada navegador no dejara un tamaño distinto, sino que todos lo tendrían a cero.

Facebooktwittergoogle_plus