Regras de estilos

A sintaxe xenérica para definir unha regra de estilo é a seguinte:

selector {
propiedade1:valor1;
...
propiedadeN:valorN;
}

O selector pode ser:

Etiqueta HTML - Cada etiqueta HTML é un posible selector. Ó definir como selector unha etiqueta HTML podemos cambiar o aspecto de tódolos puntos da páxina que sexan definidos mediante esa etiqueta.
Clase - Selector abstracto aplicable a calquera elemento só con especificar no atributo class do elemento, o nome do selector ou clase. Este nome poderá ser distinto ó de calquer etiqueta HTML e deberá de levar diante do nome un punto.
Selector de identidade – Para un elemento individual identificado de forma única mediante o atributo id presente en toda etiqueta HTML
Selector contextual ou descendente – Para elementos que están dentro (descenden) doutro elemento.
Selector fillo – Para elementos que sexan directamente fillos doutro elemento
Selector adxacente - Para elementos que están próximos entre si.
Pseudoclase e pseudo elemento - Enlace, primeira letra, primeira liña, etc.

A cada selector débelle seguir unha declaración do estilo encerrada entre chaves. A declaración do estilo componse dunha lista de propiedades e valores da forma propiedad:valor (p.e. color:red) separadas por punto e coma (;). Só se poden utilizar propiedades e valores contemplados no estándar CSS.

Pode asignarse unha regra de estilo a varios selectores separándoos por comas. Se queremos que algún dos selectores que comparten propiedades teña algunha en solitario basta con duplicar unha declaración para ese selector:

selector1, selector2, ..........., selectorN {
propiedade1:valor1;
...
propiedadeN:valorN;
}
selector1 {
propiedadeX:valorX
}

Unha regra mal escrita será ignorada polo navegador. Debe de ter en conta:

Os selectores, aínda que sexan elementos html escríbense sen <>.
Pode usar minúsculas e maiúsculas, pero cando faga referencia ó estilo, deberá especificar o nome según o escribiu na folla de estilos pois faise distinción entre minúsculas e maiúsculas.
As declaracións de cada selector van encerradas entre chaves {} .
Se establecemos varias propiedades para un mesmo selector separámolas por punto e coma ; .
Se establecemos que varios selectores teñan a mesma regra de estilo separamos os selectores por comas.
Cando se usen unidades de medida non se poden empregar espazos entre o número e as unidades. Por exemplo 2px.
Pódense engadir liñas e espazos en branco entre declaracións para mellorar a lexibilidade.
Nas follas de estilo externas o único formato de comentario admisible é /* */.

Conflitos e Herencias

O estándar CSS está previsto para que poida aplicarse de forma simultánea máis dunha folla de estilo. Se as definicións de estilo non están en conflito, todas elas serán aplicadas. Se polo contrario dúas ou máis regras son diferentes para a mesma propiedade surxe un conflito de estilos que será resolto:

Os estilos declarados dentro da propia páxina HTML prevalecen sobre os declarados nunha páxina externa.
As follas de estilo linkadas prevalecen unhas sobre as outras en orden inverso ó de linkado.
Unha regra terá máis preferencia canto máis específica sexa. As regras de estilo dun elemento son heredadas polos elementos fillos salvo que estes teñan a súa propia.
As etiquetas HTML seguen un orden xerárquico, de anidamento: os elementos dunha páxina html son fillos do elemento body. Se asigna estilos a etiqueta <body> tódalas listas, parágrafos ... herdarán o estilo definido no body salvo que teñan asignado o seu propio valor.
Unha regra de estilo pode ser definida como importante, en tal caso cambia a orden de precedencia.
A sintaxe é a seguinte:

selector {
propiedade1:valor1 !important;
...
propiedadeN:valorN;
}

Se un conflito entre regras non pode resolverse cos criterios anteriores, prevalece a “leída” en último lugar polo navegador (salvo que se especifique !important;)
Normalmente as definicións de estilos son herdadas polos fillos. Neste curso serán indicados os casos excepcionais de estilos que non se herden.

Seguinte