¿Qué es normalize?
En el mismo sitio de Normalize lo definen como:
Normalize.css is a small CSS file that provides better cross-browser consistency in the default styling of HTML elements. It’s a modern, HTML5-ready, alternative to the traditional CSS reset.
Pero esta definición no nos sirve mucho, porque no entendemos bien qué es. Por lo cual se los explicaré yo.
En términos simples Normalize.css es un archivo .css que pone en cero todas las etiquetas HTML. Todo esto con el fin de que tu sitio web se vea igual en todos los navegadores.
¿Cómo funciona?
Normalize.css funciona como una hoja de estilo más en tu sitio web, que tiene todas las etiquetas básicas de HTML con el valor 0 (etiquetas como <a><h1><span> etc, y también incluyen las etiquetas de HTML5 como <section><article> etc.)
Al ser una hoja de estilo, debe ser tratado como tal, osea, con una extensión .css, y linkeado en el <head> de tu sitio web. No tiene nada que ver con Javascript, o cualquier otra sintaxis alejada de CSS o HTML. Osea, no hay que instalar nada, configurar nada, solamente descargar el archivo e introducirlo como explicaré más adelante.
¿Como lo "instalo"?
Hablar de instalar normalize.css está incorrecto, lo que realmente haremos es introducir el archivo en nuestra web. Lo cual es muy sencillo. Lo primero que haremos es “descargarnos” normalize.css desde su página oficial.
Luego de habernos descargado nuestro archivo, lo debemos guardar, y recomiendo (no es obligación) guardarlo con el nombre normalize.css. Lo guardaremos en la carpeta de nuestra web.
Fácil ¿no?, bueno, esto sigue siendo fácil. Ahora lo que haremos es linkearlo a nuestro sitio web, para que normalice nuestra web a todo navegador. Para eso lo linkeamos como una hoja de estilo más que es. Osea agregamos el siguente comando entre las etiquetas <head> </head>:
Código :
<html> <head> <title></title> <link rel="stylesheet" href="style.css" /> <link rel="stylesheet" href="normalize.css" /> </head> <body>
Y listo! tenemos normalizada nuestra web. Osea, lo que hicimos básicamente es obtener el archivo normalize.css, ponerlo en la carpeta de nuestra web, y linkearlo vía HTML.
Y ahora... ¿que hago?
Luego de haber puesto normalize.css en tu web, podemos empezar a trabajar. Suena
En caso (obviamente lo harás) de querer re escribir una etiqueta HTML que ya está definida con el valor 0 en normalize, lo haces sin editar el normalize.css, tu hoja de estilo tiene más prioridad que normalize.
Recuerda no editar el archivo normalize.css
¿Qué fin tiene todo esto?
El objetivo de todo esto es uno solo, que tu sitio web se vea igual en todos los navegadores.
Todo los navegadores tienen algo así como su hoja de estilo propia, lo que hacen es que cuando tú no tienes definida una etiqueta, le ponen automáticamente un valor, lo cual cambia según navegador. Para asegurarnos que nuestro sitio web se vea igual en todos lados, usamos normalize.css.
No hay comentarios:
Publicar un comentario