Prvok span pre kúsky textu v HTML

Už viete, že na to, aby sa nejaký kúsok textu, napríklad, spravil tučným - treba použiť prvok b. Avšak, čo robiť, ak chcem vyfarbiť kúsok textu na červeno? Pre takýto prípad prvok, podobný prvku b, neexistuje.

Ale existuje špeciálny prvok span - sám o sebe absolútne nič nerobí, no preň možno použiť CSS štýly, ktoré nám umožnia pridať požadovaný efekt ku kúsku textu.

Pozrime sa na príklade. Nech máme nejaký text:

html<p>
  This is a paragraph with text.
</p>

Nech chceme slovo "text" spraviť červeným. Na to obalíme tento kúsok textu do prvku span a tomuto prvku pridáme nejakú triedu:

html<p>
  This is a paragraph with <span class="red">text</span>.
</p>

No a teraz vyfarbíme prvok s takouto triedou na červeno:

css.red {
  color: red;
}

html<p>
  Lorem ipsum <span class="xxx">dolor sit</span> amet.
</p>
<p>
  <span class="xxx">Lorem ipsum</span> dolor sit amet.
</p>