ISSN 1722-375X
[Vai al menu di navigazione principale]
Home > Tutorial > Introduzione ai css > Introduzione ai CSS : Associare i fogli di stile ai documenti (X)HTML
[Vai al piè di pagina]
TOC

Introduzione ai CSS

5. Associare i fogli di stile ai documenti (X)HTML

In questa sezione saranno illustrati i metodi per collegare i CSS ai documenti (X)HTML.

I metodi sono:

Fogli di stile esterni

I fogli di stile possono essere salvati in file specifici (ad esempio http://www.constile.org/css/screen.css), con estensione .css, per essere poi collegati al codice (X)HTML tramite il tag LINK:

<head>
[...]
<link rel="stylesheet" type="text/css" media="screen" href="/css/foglio_di_stile.css" />
[...]
</head>

Per maggiori informazioni sull'attributo media si consiglia di leggere l'articolo: "Diversi media, diversi stili".

Fogli di stile incorporati

Le regole dei CSS possono essere specificate direttamente nel codice (X)HTML tramite il tag STYLE posto nell'HEAD del documento (X)HTML:

<head>
[...]
<style type="text/css">
<!-- 
body { font:80% Verdana,Helvetica,sans-serif; }
p { font: 1.00em/1.20em verdana, helvetica, sans-serif }
[...]
-->
</style>
[...]
</head>
La regola @import

La regola @import permette di importare regole da un altro foglio di stile. Ad esempio:

@import url("advanced.css");
@import special.css;
body { font:80% Verdana,Helvetica,sans-serif; }
p { font: 1.00em/1.20em verdana, helvetica, sans-serif }
[...]

Se presenti, le regole @import devono precedere le altre regole.

CSS in linea

Attraverso l'attributo STYLE è possibile specificare le regole CSS direttamente nei tag a cui esse saranno applicate:

<body style="background: #CCC; color: #000; font: 1.00em verdana, helvetica, sans-serif">
  <p>
    In questo paragrafo, 
    <span style="background: yellow">questo testo</span> 
    sarà evidenziato in giallo
  </p>
</body>
TOC
G.T. -- ultima revisione: 03.10.2002