This translation is incomplete. Please help translate this article from English.

L'objectiu bàsic del llenguatge de la Fulla d'Estil en Cascada (CSS) és permetre que un motor del navegador pinti elements de la pàgina amb característiques específiques, com ara colors, posicionament o decoracions. La sintaxi CSS reflecteix aquest objectiu i els seus components bàsics són:

  • La propietat és un identificador, és un nom legible per humans, que defineix quina característica es considera.
  • El valor descriu com el motor ha de manejar la característica. Cada propietat té un conjunt de valors vàlids, definits per una gramàtica formal, així com un significat semàntic, implementat pel motor del navegador.

Declaracions CSS

Establir propietats CSS a valors específics és la funció principal del llenguatge CSS. Un parell de propietats i valors s'anomena declaració, i qualsevol motor CSS calcula quines declaracions s'apliquen a cada element d'una pàgina per tal d'establir-la de forma adequada i definir-la.

Les dues propietats i els valors no són sensibles a majúscules i minúscules de manera predeterminada a CSS. El parell està separat per dos punts, ':' (U + 003A COLON), i els espais en blanc abans, entre i després de les propietats i valors, però no necessàriament a l'interior, s'ignoren.

css syntax - declaration.png

Hi ha més de 100 propiertats diferents en CSS i un nombre gairebé infinit de valors diferents. No es permeten tots els parells de propietats i valors i cada propietat defineix quins són els valors vàlids. Quan un valor no és vàlid per a una propietat determinada, la declaració es considera invàlida i és totalment ignorada per el motor CSS .

Blocs de declaracions CSS

Les declaracions s'agrupen en blocs, és a dir, en una estructura delimitada per una clau d'obertura, '{' (U+007B LEFT CURLY BRACKET), i una de tancament, '}' (U+007D RIGHT CURLY BRACKET). Els blocs de vegades poden ser niats, de manera que les claus d'oberture i tancament han de coincidir.

css syntax - block.png

Aquests blocs són naturalment anomenats blocs de declaració i les declaracions dins d'elles estan separades per un punt i coma, ';' (U + 003B SEMICOLON). Un bloc de declaració pot estar buit, aixó és, que conté una declaració nul·la. Els espais en blanc al voltant de les declaracions s'ignoren. L'última declaració d'un bloc no necessita ser acabada per un punt i coma, tot i que sovint es considera un bon estil per fer-ho ja que evita oblidar-se d'afegir-lo quan s'estén el bloc amb una altra declaració.

css syntax - declarations block.png

El contingut d'un bloc de declaració CSS, és una llista de declaracions separades per punt i coma, sense les claus inicials i de tancament, es pot incloure dins d'un atribut d'estil.

Regles de CSS

Si les fulles d'estil només poguessin aplicar una declaració a cada element d'una pàgina web, serien bastant inútils. L'objectiu real és aplicar diferents declaracions a diferents parts del document.

CSS ho permet associant condicions amb blocs de declaracions. Cada bloc de declaració (vàlid) està precedit d'un o més selectors que són condicions que seleccionen alguns elements de la pàgina. El bloc de declaracions d'un grup de parells de selectors s'anomena un conjunt de regles (ruleset), o sovint només una regla (rule).

css syntax - ruleset.png

Com que un element de la pàgina pot coincidir amb diversos selectors i, per tant, amb diverses regles que poden incloure una propietat determinada en diverses ocasions, amb valors diferents, l'estàndard CSS defineix quina té prioritat sobre l'altra i s'ha d'aplicar: això s'anomena algorisme en cascade.

És important notar que fins i tot si un conjunt de regles caracteritzat per un grup de selectors és una espècie d'abreviatura que reemplaça els conjunts de regles amb un sol selector cadascun, això no s'aplica a la validesa del conjunt de regles en si.

Això dóna lloc a una conseqüència important: si un únic selector bàsic no és vàlid, com quan s'utilitza un pseudo-element o pseudo-classe desconegut, el selector sencer és invàlid i per tant s'ignora tota la regla (no és vàlida).

Sentències CSS

Els conjunts de regles són els blocs principals de construcció d'una fulla d'estil, que sovint només consisteixen en una gran llista d'elles. Però hi ha una altra informació que un autor web vol transmetre en la fulla d'estil, com el joc de caràcters, altres fulles d'estil externes per importar, descripcions de tipus de fonts o comptadors de llistes i molts més. Utilitzarà altres tipus específics de declaracions per fer-ho.

Una declaració és un bloc de construcció que comença amb qualsevol caràcter que no sigui l'espai i que finalitza en la primera clau de tancament o punt i coma (fora d'una cadena, no escapada i no s'inclou en un altre parell de {}, () o []).

css syntax - statements Venn diag.png

Hi ha dos tipus de declaracions:

  • Conjunt de regles (Rulesets) (o regles) que, com es veu, associen una col·lecció de declaracions CSS a una condició descrita per un selector.
  • Regles-At (At-rules) comencen amb un signe, '@' (U+0040 COMMERCIAL AT), seguit d'un identificador i, després continuen fins al final de la sentència, és a dir fins al següent punt i coma (;) fora d'un bloc o al final del bloc següent. Cada tipus de regles-at, definides per l'identificador, poden tenir la seva pròpia sintaxi interna, i la semàntica per descomptat. S'utilitzen per transmetre informació de metadades (com @charset o @import), informació condicional (com @media o @document), o informació descriptiva (com @font-face).

Qualsevol declaració que no sigui un conjunt de regles (ruleset) o una at-rule no és vàlida i és ignorada.

Hi ha un altre grup de declaracions – les declaracions niades. Aquestes són declaracions que es poden utilitzar en un subconjunt específic de regles-at – les regles de grup condicional. Aquestes declaracions només s'apliquen si es compleix una condició específica: el contingut de la regla-at @media només s'aplica si el dispositiu en què el navegador s'executa coincideix amb la condició expressada; el contingut de la regla-at @document només s'aplica si la pàgina actual coincideix amb algunes condicions, i així successivament. En CSS1 i CSS2.1, només es podien utilitzar conjunts de regles dins de les regles de grup condicional. Això va ser molt restrictiu i aquesta restricció es va aixecar en CSS Conditionals Level 3. Ara, tot i que encara és experimental i no és compatible amb tots els navegadors, les regles de grup condicional poden contenir un rang de contingut més ampli: però també alguns conjunts de regles, però no totes les regles-at.

Vegeu també

Document Tags and Contributors

 Contributors to this page: Legioinvicta
 Last updated by: Legioinvicta,