Una buena práctica es tener un archivo para cada tecnología o estándar, es decir, una carpeta con puro HTML, CSS o JavaScript.
Comúnmente el nombre que recibe el archivo CSS es main.css o style.css, pero puede tener cualquier nombre. Cuando estamos trabajando por lo general lleva el nombre de la pantalla o HTML.
Es usando la etiqueta link
dentro del head
.
Es la mejor forma de insertar CSS a nuestro HTML.
Usando la etiqueta style
después de la etiqueta de head
pero antes del body
, esta forma se ocupa en algunos casos pero no es la mejor práctica.
En caso de que tengamos muchos estilos se va a tardar mucho tiempo el proyecto en cargar.
Se lo utiliza cuando tenemos muy, pero muy pocos estilos.
<!DOCTYPE html>
<html lang="en">
<head>...</head>
<style>
p {
color: blue;
font-size: 30px;
}
</style>
<body>
<main>
<p>Soy un texto</p>
</main>
</body>
</html>
Tampoco es la mejor forma de introducir CSS a nuestro proyecto, hay que evitala lo mayor posible. Este metodo puede rescribir todos los estilos que tengamos en nuetros archivo CSS.
Se lo llama estilo embebido. Embebemos o inyectamos directamente a la etiqueta, en forma de atributo con style
, los estilos del CSS.
Esto puede reescribir todos los estilos que tengamos en un archivo CSS.
<p style="color: red;">Soy un texto</p>