Principiantecss
Las 3 formas de aplicar CSS
Conoce los métodos para conectar tu diseño CSS a tu estructura HTML.
1. CSS Inline (En línea)
Se aplica directamente en la etiqueta HTML usando el atributo
style. Es útil para arreglos urgentes, pero se recomienda evitarlo en archivos grandes porque hace que el HTML sea difícil de leer.html
1<h1 style="color: blue; text-align: center;">Título Azul</h1>2. CSS Interno
Se escribe dentro del HTML, en la sección
<head>, usando la etiqueta <style>. Es útil si tienes una página web de un solo archivo y no quieres crear carpetas extra.html
1<head>
2 <style>
3 body {
4 background-color: lightgray;
5 }
6 h1 {
7 color: blue;
8 }
9 </style>
10</head>3. CSS Externo (El recomendado)
Se escribe todo el CSS en un archivo separado terminado en
.css (por ejemplo, styles.css) y se "enlaza" en el HTML. Esto te permite usar el mismo diseño para 100 páginas diferentes editando un solo archivo.html
1<!-- En el HTML (<head>): -->
2<link rel="stylesheet" href="styles.css">
3
4/* En el archivo styles.css: */
5h1 {
6 color: blue;
7}Prueba lo aprendido
Escribe código y ejecútalo directamente en el navegador.
Live Sandbox (HTML)
Output