CSS => Estructura y formato de una regla CSS

Observaciones

Para facilitar la lectura, mantenga todas las declaraciones sangradas en un nivel de su selector y la llave de cierre en su propia línea. Agregue un solo espacio después de los selectores y los dos puntos, y siempre coloque un punto y coma después de la declaración final.

Bueno

p {
    color: maroon;
    font-size: 16px;
}

Malo

p{
 color: maroon;
font-size:16px }

Un trazador de líneas

Si solo hay una o dos declaraciones, puede salirse con la suya. No recomendado para la mayoría de los casos. Siempre sea consistente cuando sea posible.

p { color: maroon; font-size: 16px; }

Reglas, selectores y bloques de declaración

Una regla CSS consta de un selector (por ejemplo, h1 ) y un bloque de declaración ( {} ).

h1 {}

Listas de propiedades

Algunas propiedades pueden tomar varios valores, conocidos colectivamente como una lista de propiedades .

/* Two values in this property list */
span {
    text-shadow: yellow 0 0 3px, green 4px 4px 10px;
}

/* Alternate Formatting */
span {
    text-shadow:
        yellow 0 0 3px,
        green 4px 4px 10px;
}

Selectores multiples

Cuando agrupa los selectores de CSS, aplica los mismos estilos a varios elementos diferentes sin repetir los estilos en su hoja de estilos. Use una coma para separar los selectores agrupados múltiples.

div, p { color: blue }

Así que el color azul se aplica a todos los elementos <div> y todos los elementos <p> . Sin la coma, solo los elementos <p> que son un elemento secundario de un <div> serían rojos.

Esto también se aplica a todos los tipos de selectores.

p, .blue, #first, div span{ color : blue }

Esta regla se aplica a:

<p>
elementos de la clase blue
elemento con el ID first
cada <span> dentro de un <div>

Modified text is an extract of the original Stack Overflow Documentation

Licenciado bajo CC BY-SA 3.0

No afiliado a Stack Overflow

CSS
Estructura y formato de una regla CSS

Buscar..