Buenas a tod@s, muchas veces al empezar en diseño web vemos que las páginas webs que creamos se comportan diferentes dependiendo del navegador con el que lo abramos.
Os copio un trozo de la wikipedia explicando el problema con los navegadores y como se intenta minimizar las posibles diferencias que nos puede surgir.
Los Reset CSS son unas hojas de estilo en cascada que se suelen incluir al comienzo de un documento HTML, y cuya función es la de minimizar, en la medida de lo posible, las múltiples diferencias visuales que se dan a la hora de mostrar una misma página web, en diferentes navegadores, causa de que cada navegador implementa su hoja de estilos propia e interna, con determinados valores por defecto, que no siempre siguen la recomendación de la organización W3C.
El consorcio W3C, junto con su especificación de CSS 2.11 del 23 de abril de 2009, publicó en su recomendación, un valor por defecto para cada propiedad de CSS que deberían adoptar los agentes de usuario. Debido a que algunos navegadores hicieron caso omiso a sus indicaciones, los diseñadores web se han visto obligados a recurrir al uso de este tipo de trucos para garantizar la correcta visualización en la mayoría de navegadores.
Código: css
Una forma fácil de implementar el código es crear un archivo con el nombre "reset.css" y despues solo tenemos que referenciarlo en el html. Así evitamos tener que copiarlo en cada archivo css. Por ejemplo:
Código: html5
ATENCIÓN: Se recomienda ejecutar primero el código de reset, si se ejecuta despues de vuestro propios archivos css posiblemente se desconfigure toda la web.
Espero que os ayude, este código pertenece a Eric Meyer. Su web es: No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
Enlace del código: No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
Un saludo.
Os copio un trozo de la wikipedia explicando el problema con los navegadores y como se intenta minimizar las posibles diferencias que nos puede surgir.
DESCRIPCIÓN WIKIPEDIA
Los Reset CSS son unas hojas de estilo en cascada que se suelen incluir al comienzo de un documento HTML, y cuya función es la de minimizar, en la medida de lo posible, las múltiples diferencias visuales que se dan a la hora de mostrar una misma página web, en diferentes navegadores, causa de que cada navegador implementa su hoja de estilos propia e interna, con determinados valores por defecto, que no siempre siguen la recomendación de la organización W3C.
El consorcio W3C, junto con su especificación de CSS 2.11 del 23 de abril de 2009, publicó en su recomendación, un valor por defecto para cada propiedad de CSS que deberían adoptar los agentes de usuario. Debido a que algunos navegadores hicieron caso omiso a sus indicaciones, los diseñadores web se han visto obligados a recurrir al uso de este tipo de trucos para garantizar la correcta visualización en la mayoría de navegadores.
CÓDIGO CSS
/* 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;
}RECOMENDACIONES
Una forma fácil de implementar el código es crear un archivo con el nombre "reset.css" y despues solo tenemos que referenciarlo en el html. Así evitamos tener que copiarlo en cada archivo css. Por ejemplo:
<!DOCTYPE html>
<head>
<title>Mi Página</title>
<meta charset="utf-8" />
<link type="text/css" rel="stylesheet" href="reset.css" />
<link type="text/css" rel="stylesheet" href="index.css" />
</head>
<body>
<!-- Vuestra web -->
</body>
</html>ATENCIÓN: Se recomienda ejecutar primero el código de reset, si se ejecuta despues de vuestro propios archivos css posiblemente se desconfigure toda la web.
Espero que os ayude, este código pertenece a Eric Meyer. Su web es: No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
Enlace del código: No tienes permitido ver los links. Registrarse o Entrar a mi cuenta
Un saludo.
.