<!-- Dette er ineffektiv HTML-kode -->
<ul>
<li class="fet">Tekst</li>
<li class="fet">Tekst</li>
<li class="fet">Tekst</li>
<li class="fet">Tekst</li>
<li class="fet">Tekst</li>
</ul>
</* Dette er CSS-koden */
.fet {
font-weight: bold;
}
<!-- Dette er effektiv HTML-koden -->
<ul>
<li>Tekst</li>
<li>Tekst</li>
<li>Tekst</li>
<li>Tekst</li>
<li>Tekst</li>
</ul>
</* Dette er CSS-koden */
ul li {
font-weight: bold;
}
I det siste eksempelet har jeg fjernet alle klassebenevnelse for <li>-taggene i HTML-koden. I CSS sier jeg at alle <li>-tagger som ligger innenfor <ul>-taggen skal følge stilregelen. Mye ryddigere HTML-kode!