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,
Lorem ipsum dolor sit amet,
consectetur adipisicing elit ...
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.
|