Reseteando los estilos CSS predeterminados de un navegador

Posted on Enero 30, 2008. Filed under: General, Programación | Tags: código, CSS, Diseño, navegador, recursos, Usabilidad |

Cada navegador, ya sea Internet Explorer, Safari, Firefox, Opera, etc., tienen su propio archivo de estilos CSS por defecto, lo que contribuye en gran medida a que nuestras páginas no se vean iguales en cada uno de ellos. En el blog de Carlos Leopoldo (dedicado a la programación y al desarrollo web) encontré un código CSS para que todos los estilos se vean iguales sin importar el navegador. Pueden agregar el código como un estilo CSS independiente de otros que quieran utilizar.

El código que estandariza el aspecto de los estilos en los navegadores es el siguiente:

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: "" "";
}