Articulos

Reseteo de estilos [CSS]

Quizás alguna vez, diseñando alguna web, a la hora de visualizarla en diferentes exploradores (o sistemas operativos), notabais pequeñas diferencias (espacios de más, capas que no se posicionan bien...).

Si se ha hecho bien el código (teniendo en cuenta los hacks y problemas en diferentes navegadores), quizás la solución sea resetear los estilos.

Para ello, Eric Meyer programó este reseteo, que quita los valores por defecto de los navegadores (principales causantes de muchos problemas de diseño). El código es el siguiente:

/* v1.0 | 20080212 */

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,
b, u, i, center,
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-size: 100%;
	vertical-align: baseline;
	background: transparent;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}

/* remember to define focus styles! */
:focus {
	outline: 0;
}

/* remember to highlight inserts somehow! */
ins {
	text-decoration: none;
}
del {
	text-decoration: line-through;
}

/* tables still need 'cellspacing=\"0\"' in the markup */
table {
	border-collapse: collapse;
	border-spacing: 0;
}

Es probable que a la hora de implementarlo, si vuestra web se veía más o menos bien, deje de verse "tan bien". Es normal, lo mejor es adecuarla al reseteo y tendreis una web bien diseñada y construida.

Fuente: Web del autor

Hay 1 comentario(s) referentes al artículo

[#1] Escrito por kinkitera (07/05/2008)