Conas a dhéanann an cascade agus an oidhreacht a chinneadh cé na stíleanna a bhhíonn i bhfeidhm?

Question

Accepted Answer

Nuair a bheadh roinnt rialacha ábalta a stíleáil ar eilimint, cinneann dhá mheicníochas an toradh: an **cascade** (cén riail a bhuaileann) agus **oidhreacht** (cé na hairíonna a théann síos ó thuismitheoirí).

## Cén fáth a bhfuil sé tábhachtach

Roghnaíonn an brabhsálaí an dearbhú buaiteach trí sheiceáil, in ord tosaíochta:

```text
1. Importance   → !important beats normal declarations
2. Specificity  → more specific selector wins (ids > classes > elements)
3. Source order → if still tied, the LAST rule defined wins
```

```css
p { color: blue; }          /* specificity 0,0,1 */
.text { color: green; }     /* specificity 0,1,0 → wins over the element rule */
p { color: red; }           /* same specificity as first, but LATER → would beat blue */
/* result for <p class="text">: green (class beats element) */
```

## Oidhreacht — roinnt airíonna a théann chuig leanaí

Bíonn roinnt hairíonna (go príomha **gaolmhar le téacs**) oidhreachtaithe go fonnmhar ag na garmhacáin; ní bhíonn an chuid eile ann.

```css
body {
  color: #333;        /* ✅ inherited — all text descendants get it */
  font-family: serif; /* ✅ inherited */
  border: 1px solid;  /* ❌ NOT inherited — children don't get a border */
}
```

**Oidhreachtaithe** go réamhshocraithe: `color`, `font-*`, `line-height`, `text-align`, `visibility`, `cursor`. **Gan oidhreacht**: `border`, `margin`, `padding`, `background`, `width`, `height`, `display`.

## Oidhreacht a rialú go sainraite

```css
.child {
  color: inherit;  /* force-take the parent's value */
  border: initial; /* reset to the property's default */
  all: unset;      /* reset everything: inherit if inheritable, else initial */
}
```

## Achoimre ar dhifríochtúlacht laistigh den cascade

Seo an fáth ar féidir le riail ísealspéasúlachta a bheith caillte fiú má scríobhtar é níos déanaí — bítear ag seiceáil spéasúlachta *roimh* ord an fhoinse. Tuigint an ord (tábhacht → spéasúlacht → ord an fhoinse) a mhíníonn beagnach gach cás de "mo stíl nach bhfuil i bhfeidhm".

## Cén fáh a bhfuil sé tábhachtach

Is é an cascade agus an oidhreacht an tsamhail bhunúsach ar *conas a réitítear CSS i ndáiríre*.

Ag fios an ord tosaíochta déanann sé dífhabhtú ar choimhlintí, ag fios cé na hairíonna a bhíonn oidhreachtaithe tugann sé ar ais duit `color`/`font` a shocrú fadó ar `body` in ionad go bhfuil sé in aon áit eile, agus `inherit`/`initial`/`unset` a thugann ar ais duit rialú beacht — le chéile, déanann siad CSS intuigthe seachas dhraíochta.