Teoría
Teoría

Otras formas de conectar CSS

Establecer los estilos de cada etiqueta mediante el atributo style es muy incómodo. También lleva a atascar el código HTML con piezas repetitivas de CSS.

Afortunadamente, hay otras formas de conectar estilos. La primera es conectar un archivo externo mediante la etiqueta <link>, y la segunda es utilizar una etiqueta especial <style>.

Ahora te familiarizarás con la segunda sección del editor: la pestaña style.css. El código del editor CSS se inserta en el documento HTML como si lo hubieras escrito en la etiqueta <style>. Así es como se ve esta pestaña:

index.htmlstyle.css

En primer lugar, limpiaremos el código en el editor HTML y, a continuación, empezaremos a dar estilo a nuestro minicontenido paso a paso utilizando otras funciones CSS.

index.html
style.css

HTML

<!DOCTYPE html> <html> <head> <title>Otras formas de conectar CSS</title> <link rel="stylesheet" href="style.css"> </head> <body> <h1>Esquema del curso</h1> <p style="color: green;">Etiquetas de emparejamiento.</p> <p style="color: green;">Etiquetas individuales.</p> <p style="color: green;">Atributos de la etiqueta.</p> <p style="color: green;">Estilos en línea (incorporados).</p> <p style="color: red;">Estilos exteriores.</p> <p style="color: red;">Estilización por clases.</p> </body> </html>

CSS

/* body { font-family: "Tahoma", serif; } p { color: green; } */

ObjetivosRealizado

Elimina todos los atributos de style de los párrafos,
a continuación, elimine los caracteres /* en la primera línea del editor CSS.