Sintaxis CSS

Tabla de contenido

    Mostrar tabla de contenidos

Una regla CSS consta de un selector y un bloque de declaración.

Sintaxis CSS

El selector apunta al elemento HTML al que desea aplicar estilo.

El bloque de declaración contiene una o más declaraciones separadas por punto y coma.

Cada declaración incluye un nombre de propiedad CSS y un valor, separados por dos puntos.

Varias declaraciones CSS están separadas por punto y coma y declaración Los bloques están rodeados por llaves.

Ejemplo

En este ejemplo, todos los elementos <p> estarán alineados al centro, con un rojo color de texto:

p
{
  color: red;
  text-align: center;
}

Pruébelo usted mismo →

<!DOCTYPE html>
<html>
<head>
<style>
p {
  color: red;
  text-align: center;
} 
</style>
</head>
<body>

<p>Hello World!</p>
<p>These paragraphs are styled with CSS.</p>

</body>
</html>

Ejemplo explicado

  • p es un selector en CSS (apunta al elemento HTML al que desea aplicar estilo: <p>).

  • color es una propiedad y rojo es el valor de la propiedad

  • text-align es una propiedad y center es el valor de la propiedad

¡Aprenderá mucho más sobre los selectores de CSS y las propiedades de CSS en los próximos capítulos!