CSS Sintaxis

El código SCC es un código que tiene unas normas de escritura, y es por eso cuando escribimos el código CSS tenemos que cumplir ciertas reglas.

La sintaxis CSS es una regla que consta principalmente de un selector y un bloque de declaración que modifican el estilo de un elemento HTML.

¿Cuál es la Sintaxis CSS?

Este tema de sintaxis CSS vamos a ver con un ejemplo para entenderlo mucho mejor.

A continuación te voy a explicar en palabras simples acerca de esta sintaxis CSS. El selector apunta a un elemento de HTML para diseñar su apariencia, y el bloque de declaración contiene una o más declaraciones separadas por punto y coma. Además, los bloques de separación están rodeados por dos llaves.

Ahora, cada declaración consta de un nombre de propiedad CSS y un valor, y estás separadas siempre por dos puntos.

Ejemplo de sintaxis CSS

En este ejemplo, todos los elementos <p> de un documento HTML estarán alineados al centro y el color de texto será rojo:

p { color: red; text-align: center; } <p> Estás aprendiendo de Sintaxis CSS en este tutorial. </p>
Lenguaje del código: HTML, XML (xml)

Estás aprendiendo de Sintaxis CSS en este tutorial.

Explicando el ejemplo

  • p es un selector en CSS que apunta al elemento HTML <p> que deseamos diseñar su estilo.
  • color es una propiedad del elemento HTML <p>, y red es el valor de la propiedad para pintar el color texto, en este caso de color rojo.
  • text-align también es una propiedad del elemto HTML <p>, y center es el valor de la propiedad.

Más ejemplos

<!DOCTYPE html> <html lang="es"> <head> <meta charset="utf-8" /> <title>Sintaxis CSS</title> <style> h1 { color: blue; font-size: 30px; text-align: center; } h2 { color: red; font-size: 24px; text-align: center; } p { font-size: 18px; color: darkmagenta; background-color: greenyellow; text-align: center; } </style> </head> <doby> <h1>Tutorial de Sintaxis CSS</h1> <p>Aprende acerca de Sintaxis CSS con este tutorial.</p> <h2>Más Ejemplos</h2> <p>Realiza más ejemplos de sintaxis CSS</p> </doby> </html>
Lenguaje del código: HTML, XML (xml)