Pomocou kaskádových štýlov sa vytvárajú štruktúrované dokumenty, teda oddeľuje sa obsah dokumentu (HTML) od jeho vzhľadu (CSS). Získa sa tým prehľadný a jednoduchý kód. CSS je možné presunúť do externých súborov, zmenší sa tým dátová veľkosť a dá sa jedným súborom zmeniť celý štýl stránky. Cieľom každého webdesignera je vytvoriť stránku tak, aby vyzerala čo najviac podobne v najpoužívanejších prehliadačoch. CSS nezaručuje rovnaké vykresľovanie vo všetkých prehliadačoch. Vzhľadom k rôznym interpretáciam css rôznymi prehliadačmi je nemožné aby stránka vyzerala na pixel rovnako. Najväčší problém v interpretácii css má internet explorer. V súčasnosti sa stránky optimalizujú pre IE verzie 7 a vyššie.
PRÍKLAD
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<HTML>
<HEAD>
<TITLE>Skúšobná www stránka</TITLE>
<META http-equiv="Content-Type" content="text/html; charset="utf-8">
<STYLE type="text/css">
BODY {
font-family: 'Arial';
/* Na celej stránke bude font Arial */
color: blue;
/* Text bude modrý */
font-size: 12px;
/* Veľkosť textu bude 12 pixelov */
}
H1 {
color: red;
/* všetky veľké nadpisy budú červené */
}
</STYLE>
</HEAD>
<BODY>
<!-- Aktivuje sa štýl pre BODY-->
<H1>Používam CSS</H1>
<!-- Aj keď pre BODY mám modrú farbu, prekryje to najneskôr použité (H1), takže bude červený-->
<P>Text</P> <!-- Tento text bude modrý (červená sa ukončila /H1)-->
</BODY>
</HTML>
