Curso de CSS
Dale estilo y vida a la web.
Aprende CSS con ejemplos interactivos y crea proyectos reales.
CSS puede vivir en el mismo archivo HTML o en un archivo aparte. Veamos las tres formas de conectar estilos a tu página y cuál conviene usar.
Explicación
Existen tres formas de agregar CSS a una página, y cada una tiene su propio caso de uso:
style="..."CSS en línea: se escribe directo en el atributo style de una etiqueta. Útil solo para pruebas rápidas.
<style>...</style>CSS interno: se escribe dentro de una etiqueta <style> en el <head> del documento.
<link rel="stylesheet" href="...">CSS externo: conecta un archivo .css aparte. Es la forma recomendada porque separa contenido y estilo, y se puede reutilizar en varias páginas.
Reto rápido
Agrega un estilo en línea a otro elemento distinto y compáralo con el estilo que ya viene del CSS.
En esta lección
- Ejemplo interactivo
- Explicación de cada etiqueta
- Cuándo usarlo
- Errores comunes
Consejo
En proyectos reales casi siempre se usa CSS externo: mantiene el HTML limpio y permite reutilizar los mismos estilos en muchas páginas.
Dato extra
Si usas los tres tipos de CSS al mismo tiempo, el CSS en línea gana casi siempre por tener más prioridad. Verás esto a fondo cuando estudies la cascada y la especificidad.
Error común
Olvidar la etiqueta <link> en el <head>, o escribir mal la ruta del archivo .css: la página se ve sin ningún estilo aplicado y no hay ningún error visible en la página.
Siguiente paso
Ya sabes cómo conectar CSS a tu HTML. Ahora veamos la sintaxis exacta que sigue cada regla de estilo.
Ir a la siguiente lección