De la misma forma en que una persona se viste con diferentes estilos, los sitios web también necesitan estilo. Los estilos hacen que el sitio web refleje su “estilo personal”, es como darle un poco de vida a la página web e incluso ayuda a hacerla mas llamativa y amigable con el usuario, mejorando su experiencia. Una página web sin estilo sería como el cuerpo humano en mero esqueleto.
En desarrollo web, la forma de agregarle estos estilos a una página web es con CSS (Cascading Style Sheets), como quizá hayas visto en alguno de los curso de Platzi que has tomado (si has tomado cursos de desarrollo web acá) o en algún recurso que hayas leído en la web.
Existen 3 formas de agregar estilos en CSS, lo cuales verás a continuación con una breve explicación y con un código de ejemplo:
1. Estilos en línea o inline css: Se agrega el estilo directamente a la etiqueta del HTML a la que quieres darle estilo, así:
<pstyle="color: blue;">Esto es un párrafo</p>.
2. Estilos internos o internal css: Esta se agrega en la etiqueta <head> del documento HTML. Se utiliza la etiqueta <style> y dentro se empiezan a dar los estilos, por ejemplo:
<head><style>p {
color: blue;
background-color: yellow;
}
</style></head>.
3. Estilos externos o external css: Estos estilos se crean dentro de un archivo independiente con extensión .css y luego se llama el documento css o se linkea al documento html con la etiqueta <link>. Esta etiqueta link va dentro de la etiqueta head del html, así:
<head><linkrel="stylesheet"type="text/css"href="style.css"></head>.
La forma que normalmente se usa para agregar estilos, en términos de mejores practicas, es estilos externos o external css, sin embargo, no te extrañes si encuentras algo de código con estilos en línea o estilos internos.
