Reglas CSS

Introducción

CSS define básicamente cómo se van a mostrar en la pantalla los elementos HTML. Para aplicar los estilos, CSS utiliza propiedades y valores. Esta construcción se llama declaración y la sintaxis incluye dos puntos después del nombre de la propiedad y un punto y coma para cerrar la línea.

Código 1: Color: #FF0000;

Declaración de propiedades CSS.

En el ejemplo del código 1, el nombre de la propiedad es color y el valor asignado a esta propiedad es #FF0000. Si esta propiedad se aplica posteriormente a un elemento HTML, el elemento se mostrara en pantalla en color rojo. Las propiedades pueden ser agrupadas usando llaves ( { ). Este grupo de una o más propiedades se denomina regla y es identificado por un nombre o un selector, que representa el elemento o grupo de elementos que se verán afectados por la regla.

Podemos crear tantas reglas como queramos.

P {
Color: #FF0000;
Font-size: 24px;
}

Declaración de reglas CSS

En el ejemplo del código 2 usamos dos propiedades con sus correspondientes valores entre llaves (color y font-size). Esta regla se identifica con el nombre p. En este caso, el nombre de 2 la regla es una referencia a los elementos p del documento. Si aplicamos esta regla a nuestro documento, el contenido de cada elemento p será de color rojo y un tamaño de 24px.