A Sbafo! Tutto per il web gratis e in italiano...

AVVISO

   Aggiungi ai preferiti  

:: Sei qui: Home > Manuali > Indice generale dei manuali - Giochiamo con i fogli di stile - pagina 3
Indice di questo manuale Indice di tutti i manuali Area download

Giochiamo con i fogli di stile

Versione 1.0

Manuale scritto da Seatiger Team™ nel mese di agosto 2002

A SBAFO! Tutto per il web gratis e in italiano...

Copyright© Seatiger Team 2002
Sono vietate la riproduzione, la pubblicazione e la distribuzione anche parziale del presente manuale
senza il consenso scritto degli autori.


LEZIONE 1

Inclusione dei fogli di stile

I fogli di stile possono essere inclusi nelle pagine HTML in 3 modi differenti:

  1. in linea;
  2. internamente;
  3. esternamente.

L'inserimento "in linea" avviene direttamente all'interno di un prederminato tag HTML nel corpo del documento;

l'inserimento "interno" avviene nell'intestazione del documento tra i tag <head> e </head>;

l'inserimento "esterno" viene effettuato da un file apposito con estensione ".css" che viene richiamato con un semplice link all'interno dell'intestazione di ciascuna pagina.

 

1.1 Fogli di stile "in linea"

<html>
     <head>
     <title>Titolo del documento</title>
     </head>
     <body>

     <p style="gli elementi di stile vanno inseriti qui"></p>
     </body>
</html>

 

1.2 Fogli di stile "interni"

<html>
     <head>
     <title>Titolo del documento</title>

     <style type="text/css">gli elementi di stile vanno inseriti qui</style>
     </head>
     <body>
     <p>I contenuti della pagina vanno qui</p>
     </body>
</html>

 


1.3 Fogli di stile "esterni"

<html>
     <head>
     <title>Titolo del documento</title>

     <LINK href="nomefile.css" rel="stylesheet" type="text/css">
     </head>
     <body>
     <p>I contenuti della pagina vanno qui</p>
     </body>
</html>

Come si vede in quest'ultimo esempio il documento punta ad un file con estensione ".css" esterno. All'interno di questo file, preparato con il BloccoNote di Windows© o con un qualunque altro editor di testo, vi saranno tutti gli elementi di stile. Questo file potrà avere un qualsiasi nome, ma sempre estensione ".css". Ovviamente il nome vero del file dovrà essere sostituito nell'esempio posto sopra a "nomefile.css".

Nota: se il file esterno non fosse nella stessa cartella che contiene il documento HTML che lo richiama occorrerà modificare il percorso nella stringa. Se, ad esempio, si trovasse in una sottocartella chiamata stili il richiamo assumerebbe questa forma:
<LINK href="stili/nomefile.css" rel="stylesheet" type="text/css">.

Se si trovasse in una cartella superiore chiamata sempre stili il richiamo assumerebbe questa forma:
<LINK href="../stili/nomefile.css" rel="stylesheet" type="text/css">.

Se si trovasse addirittura su un altro spazio web assumerebbe questa forma:
<LINK href="http://www.nomedominio.com/nomefile.css"
rel="stylesheet" type="text/css">.

 

1.4 Che tipo di foglio di stile scegliere?

Dipende dal tipo di sito, da quante pagine è formato, se le pagine devono avere tutte o gran parte di esse lo stesso stile.

  • i fogli di stile "in linea" non sono molto pratici in quanto per ogni paragrafo interessato occorre inserirli manualmente, operazione che su pagine complesse può diventare molto lunga e ripetitiva;
  • i fogli di stile "interni" sono adatti a siti formati da poche pagine oppure a siti che, pur avendo un certo numero di pagine, necessitano di stili differenti per ciascuna pagina o gruppo di pagine;
  • i fogli di stile "esterni" sono adatti a siti di dimensioni medio grandi o grandi e che hanno l'esigenza che tutte le pagine abbiano, in termini di stile, le medesime caratteristiche. Con un foglio di stile "esterno" è infatti estremamente facile cambiare le caratteristiche di tutte le pagine: se abbiamo un sito scritto tutto in "Arial 12" e vogliamo sostituire il carattere con un "Verdana 10" basterà cambiare il riferimento al font nel foglio di stile e, in un colpo solo, avremo modificato tutte le pagine !

 


Torna alla pagina precedente Vai alla pagina successiva
Pagina precedente Pagina successiva
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20

Registrazione dominio, spazio illimitato, 5 caselle di posta, a soli 24,79 euro all'anno iva inclusa.

www. .

Questo sito è ottimizzato per Explorer 5.0 o superiore, Java compatibile. Alcune delle applicazioni presenti potrebbero non essere supportate da Netscape© o da sistemi operativi diversi da Microsoft© Windows. Tutti i marchi citati sono di proprietà dei loro legittimi autori.

Webmaster: Seatiger Team