Alternatywa dla znacznika <span>

Question

Witam!

Od niedawna uczę się HTML wraz z CSS i poznałem już niektóre podstawy. Piszę teraz dla siebie małe kompendium wiedzy w formie strony www. Niektóre znaczniki które są dla mnie istotne chciałem sobie odpowiednio wystylizować, tak żeby łatwiej rzucały się w oczy. Użyłem do tego celu znaczników <span> w środku paragrafu. Wygląda, to tak:

<p>
  Warto też wspomnieć o znacznikach

    <span style="background-color:red;"><span style="font-family:consolas;">&lt;</span><span style="color:white;font-family:consolas;">abbr</span><span style="font-family:consolas;">&gt;</span></span>

    <span style="background-color:#4db8ff;"><span style="color:#ffcc00;font-family:consolas;">&lt;</span><span style="font-family:consolas;">samp</span><span style="color:#ffcc00;font-family:consolas;">&gt;</span></span>

    <span style="background-color:#ffcc99;"><span style="color:#ff00ff;font-family:consolas;">&lt;</span><span style="color:#0066ff;font-family:consolas;">cite</span><span style="color:#ff00ff;font-family:consolas;">&gt;</span></span>

    <span style="background-color:#006600;"><span style="color:#99e6ff;font-family:consolas;">&lt;</span><span style="color:#66ff33;font-family:consolas;">kbd</span><span style="color:#99e6ff;font-family:consolas;">&gt;</span></span>
    itp. Każdy z nich w podobny sposób manipuluje tekstem.
</p>

Moje pytanie. Czy jest jakiś lepszy sposób, aby te fragmenty wyglądały tak, a nie inaczej? W sensie - czy jest jakiś sposób, żeby mój kod był bardziej zwięzły i przejrzysty? Z góry dziękuje za odpowiedź.

Answer 1

Stylowanie w osobnym pliku ?

Comments

Faktycznie! Dzięki

Answer 2

Oprócz stylowania przy pomocy klas i wywalenia CSS-a do osobnego pliku, warto zauważyć, że w tym wypadku najlepiej byłoby użyć znacznika code, nie zaś span.

Answer 3

Witam

Proponuje do każdego znacznika span dopisać klasę i wystylizować ją w oddzielnym pliku:
<link rel="Stylesheet" type="text/css" href="style.css" />

lub pomiędzy znacznikami <style>...</style>

Answer 4

A dlaczego nie przerzucisz do klasy?