Restablecimiento de CSS: ¿qué hace exactamente?

Encontré este archivo reset.css dentro de una demostración del control deslizante de la imagen de jquery, pero nunca se incluyó en el archivo index.html principal. ¿Qué se supone que debe hacer, y más importante, dónde lo pones? ¿Lo pones antes de cualquier hoja de estilo referenciada ()?

Aquí está el código dentro de reset.css

/* CSS reset */ body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td { margin:0; padding:0; } html,body { margin:0; padding:0; } table { border-collapse:collapse; border-spacing:0; } fieldset,img { border:0; } input{ border:1px solid #b0b0b0; padding:3px 5px 4px; color:#979797; width:190px; } address,caption,cite,code,dfn,th,var { font-style:normal; font-weight:normal; } ol,ul { list-style:none; } caption,th { text-align:left; } h1,h2,h3,h4,h5,h6 { font-size:100%; font-weight:normal; } q:before,q:after { content:''; } abbr,acronym { border:0; } 

Al principio no existía una estandarización sobre cómo funcionaban los estilos, cada navegador implementaba lo que consideraba correcto. Una de las razones por las que ve tantas preguntas sobre los errores de estilo en IE es porque IE era el navegador con más diferencias de otros navegadores en términos de diseño. Aunque IE ha mejorado y también lo han hecho otros navegadores, todavía aplican sus propios bordes, relleno y márgenes, zoom, fonts a los elementos para darles un toque único a las páginas. Un ejemplo es que Chrome proporciona sus propios bordes amarillos a los cuadros de texto. El “reinicio” en realidad “restablece” todos estos estilos a cero / ninguno, de modo que no ve ningún estilo que no haya aplicado en su página.

Si estos estilos no se “reinician”, verá estilos / efectos no deseados y cosas rotas. Siempre se recomienda “restablecer” los estilos del navegador.

Echa un vistazo a este artículo ¿Deberías restablecer tu CSS?

reset.css se utiliza para normalizar los estilos predeterminados del navegador.

Ejemplo:

enter image description here

Mirando las respuestas aquí, parece haber una confusión entre “reiniciar” y “normalizar”. Sus objectives son ligeramente diferentes.

Un restablecimiento CSS es un conjunto de estilos que carga antes de sus otros estilos, para eliminar los estilos integrados del navegador. Uno de los primeros y más populares fue Restablecer CSS de Eric Mayer.

Otra opción es armonizar los estilos integrados del navegador. La herramienta más popular para lograr esto es actualmente Normalize.css .

El navegador tiene diferentes estilos “incorporados” que se aplican a diferentes elementos html. Estas definiciones de estilo pueden variar a través de diferentes navegadores. La normalización de los archivos CSS tiene la intención de “normalizar” la representación de la página en todos los navegadores al restablecer estos estilos específicos del navegador.

Debe incluirlo antes de sus propias definiciones de estilo. De lo contrario, estos estilos podrían anular (debido a la naturaleza en cascada de CSS) tus declaraciones también, lo que no tendría mucho sentido;)

El restablecimiento de estilos más popular es probablemente el de Eric Meyer, que viene con un poco de información básica.

Cada navegador tiene su propia hoja de estilo de user agent predeterminada, que utiliza para hacer que los sitios web sin estilo parezcan más legibles. Por ejemplo, la mayoría de los navegadores predeterminados hacen que los enlaces sean azules y los enlaces visitados de color púrpura, otorgan a las tablas una cierta cantidad de borde y relleno, aplican font-size variables a H1 , H2 , H3 , etc. y una cierta cantidad de relleno a casi todo.

¿Alguna vez se preguntó por qué los botones Enviar se ven diferentes en cada navegador?

Obviamente, esto crea una cierta cantidad de dolores de cabeza para los autores de CSS, que no pueden encontrar la manera de hacer que sus sitios web tengan el mismo aspecto en todos los navegadores.

Utilizando un Restablecimiento de CSS, los autores de CSS pueden obligar a que todos los navegadores tengan todos sus estilos restablecidos a nulos, evitando así las diferencias entre navegadores tanto como sea posible.

A partir de la base consistente que ha configurado a través de su reinicio, puede continuar rediseñando su documento, ¡a salvo sabiendo que las diferencias de los navegadores en su representación predeterminada de HTML no pueden tocarlo!

Espero que haya sido útil, es posible que desee echar un vistazo a este artículo, ¿Qué restablecimiento de CSS debo usar? .

Un Restablecimiento de CSS (o “Restablecer CSS”) es un conjunto corto, a menudo comprimido (minificado) de reglas CSS que restablece el estilo de todos los elementos HTML a una línea de base consistente.

En caso de que no lo supiera, cada navegador tiene su propia hoja de estilo de “agente de usuario” predeterminada, que utiliza para hacer que los sitios web sin estilo parezcan más legibles. Por ejemplo, la mayoría de los navegadores predeterminados hacen que los enlaces sean azules y los enlaces visitados de color púrpura, otorgan a las tablas una cierta cantidad de borde y relleno, aplican tamaños de fuente variables a H1, H2, H3, etc. y una cierta cantidad de relleno a casi todo. ¿Alguna vez se preguntó por qué los botones Enviar se ven diferentes en cada navegador?

Obviamente, esto crea una cierta cantidad de dolores de cabeza para los autores de CSS, que no pueden encontrar la manera de hacer que sus sitios web tengan el mismo aspecto en todos los navegadores.

Con el restablecimiento de CSS, los autores de CSS pueden obligar a que todos los navegadores tengan todos sus estilos restablecidos a nulos, evitando al máximo las diferencias entre navegadores.

consulte http://www.cssreset.com/what-is-a-css-reset/

Los navegadores pueden representar el HTML y CSS recibidos de acuerdo con su motor de representación nativo. Los diferentes navegadores pueden usar diferentes enfoques de renderizado [IE;) si sabes a qué me refiero] así que la intención de reset.css es establecer todos los atributos en valores predefinidos comunes para que los desarrolladores / diseñadores puedan olvidar algún motor de renderizado y comenzar el desarrollo desde el arañazo