Pogledajmo zajedno kako izgleda CSS. Kratak primjer usporedbe čistog HTML kôda i web stranice izrađene CSS‑om govori sam za sebe.
Ako želimo da ispis koji vidi korisnik izgleda ovako,
možemo to uraditi sljedećim HTML kôdom:
<p>
<font face="
Courier New, Courier, mono">
<font color="
#9b5c98"
size="+2
">
<b>
Lorem</b></font>
ipsum dolor sit amet,</font>
</p>
<p>
<font face="
Courier New, Courier, mono">
<font color="
#9b5c98"
size="+2
">
<b>
consectetur</b></font>
adipisicing elit ... </font>
</p>
ili možemo napisati nekoliko linija CSS-a,
p {
font-family: "Courier New", Courier, mono
;
}
.naglaseno {
color: #9b5c98
;
font-size: 24px
;
font-weight: bold
;
}
i tada će, za isti rezultat ispisa, HTML kôd izgledati ovako:
<p>
<span class="
naglaseno">Lorem</span>
ipsum dolor sit amet ...
</p>
<p>
<span class="
naglaseno">consectetur</span>
adipisicing elit ...
</p>
U drugom primjeru izvedenom CSS-om vrijedi primijetiti dvije važne stvari:
- jednostavnost HTML kôda,
- oblik, veličina i boja znakova za obje linije kontrolira se s jednog mjesta.
-
Samo je drugi primjer HTML kôda u skladu sa strogim standardom HTML 4.01. Prvi je primjer ostvaren elementom font za koji se preporuča izbjegavati ga.
-
U stvarnim primjenama CSS-a nije preporučljivo miješati razne veličine znakova ili fontove u jednom redu kao što je to, demonstracije radi, učinjeno ovdje.
|