cosa sono te l'hanno già spiegato, io ti facci vedere un esempio:
codice:
body { font-family: Arial, sans-serif;
font-size: 10pt;
text-align:justify;
color: #3E3E3E;
background-color:#FFFFFF; }
hr { border-left-width: 0;
border-right-width: 0;
border-top-width: 0;
border-bottom-width: 1px;
border-bottom-style: dotted;
text-align:center; }
a { color: #0066FF;
text-decoration: none; }
a:hover { color: #0052CC;
border-bottom-style:dotted;
border-bottom-width:1px; }
a:active { color: #0052CC; }
....
....
.titolo { color: #939BC6;
font-variant: small-caps;
letter-spacing: 2pt;
font-weight: bold;
text-align: center;
font-size:16pt; }
....
....
con questo codice, linkando il percorso del foglio di stile in tutte le pagine web, uso le stesse impostazioni grafiche per tutto il sito, e invece di dover inserire ogni volta che voglio mettere un titolo tutte quelle cose (colore, tipo di carattere ecc), mi basterà uno <span class="titolo">Ma tu guarda che bel titolo già formattato</span>
te capì? più o meno...