Tag span untuk Bahagian Teks dalam HTML

Anda sudah tahu bahawa untuk menjadikan sebahagian teks, contohnya, tebal - anda harus menggunakan tag b. Walau bagaimanapun, apa yang perlu dilakukan jika saya mahu mewarnai sebahagian teks dengan warna merah? Untuk kes sedemikian, tag seperti tag b tidak wujud.

Sebaliknya, terdapat tag khas span - dengan sendirinya ia tidak melakukan apa-apa, tetapi kita boleh menggunakan gaya CSS padanya, yang membolehkan kita menambah kesan yang dikehendaki pada sebahagian teks.

Mari kita lihat contoh. Katakan kita mempunyai beberapa teks:

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

Katakan kita mahu menjadikan perkataan "text" berwarna merah. Untuk melakukan ini, bungkus bahagian teks ini dalam tag span dan berikan tag ini beberapa kelas:

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

Sekarang, mari warnakan elemen dengan kelas tersebut dengan warna merah:

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>