Cén fhéiniúlacht a rialaíonn an téacs agus na cló?

Question

Accepted Answer

Rialú an tipicreapachta trí theaghlach de `font-*` agus `text-*` aigneasa. Bheith á fháil i gceart is an chuid is mó is ea ar dhéanann leathanach níos socraithe agus inléite.

```css
.text {
  font-family: "Inter", system-ui, sans-serif; /* with fallbacks */
  font-size: 1rem;       /* size (use rem for accessibility) */
  font-weight: 600;      /* 100–900; 400 normal, 700 bold */
  font-style: italic;    /* normal | italic */
  line-height: 1.5;      /* spacing between lines — unitless is best */
  letter-spacing: 0.02em;/* tracking between characters */
}
```

## Staic thuairimí font-family

```css
font-family: "Inter", system-ui, -apple-system, sans-serif;
```

Trialann an brabhsálaí gach ceann i seicheamh go dtí go bhíonn ceann ar fáil. Críochnaigh i gcónaí le **teaghlach ginearálta** (`sans-serif`, `serif`, `monospace`) ionas go ndéanann an téacs a thaifeadadh fiú mura n-éiríonn le cló nó do chlóchur. Úsáideann `system-ui` cló dhúchais an OS (tapa, gan fhíoruachán).

## Airíonna leagan amach téacs

```css
.text {
  text-align: center;        /* left | right | center | justify */
  text-decoration: underline;/* underline | line-through | none */
  text-transform: uppercase; /* UPPERCASE | lowercase | Capitalize */
  white-space: nowrap;       /* prevent wrapping */
  word-break: break-word;    /* break long words/URLs */
}
```

## line-height: úsáid luachanna gan aonad

```css
line-height: 1.5;    /* ✅ 1.5 × the element's font-size — scales correctly */
line-height: 24px;   /* ⚠️ fixed — doesn't adapt if font-size changes */
```

Iolraíonn `line-height` **gan aonad** méid cló dhúchais gach eilimint, ionas go bhfanann sé comhréireach nuair a bhíonn méideanna difriúla ar eilimintí foluain — an cur chuige a mholtar.

## Téacs a theascadh (riachtanas coitianta)

```css
.truncate {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis; /* shows "..." when text is cut off */
}
```

## Cén fáth ar cúis é seo

Tiomáineann airíonna téacs an inléiteacht agus ordlathas radhairc — `font-size`/`weight` chun a bhéim, `line-height` (~1.5) chun léitheoireacht ábhartha, staic thuairimí do bhreise ionchais, agus `text-overflow` chun teascadh geal.

Is é an cló go maith an bhulc d'UI a bhfuil dea-dhéanamh aige.