INTERNET EXPLORER? Ti consiglio di navigare questo sito con Mozilla Firefox oppure con Google Chrome.

Implementare il codice Css

Autore: Luca Ruggiero | Tell a Friend

Corso HTML
Impara il linguaggio di marcatura per il Web.

Corso CSS
Web Design ed Accessibilità secondo il W3C!

Corso Web Design
Disegno di siti Web con HTML, CSS e Dynamic HTML.

Conclusi i doverosi cenni preliminari sui Css, passiamo subito all'atto pratico, vediamo come e dove e perchè applicare il codice ad una pagina o ad una serie di pagine Web.

Il codice Css può essere implementato in tre diversi modi a seconda delle esigenze:

1 direttamente su di un elemento Html
2 nell'header della pagina
3 in un file esterno con estensione .css

Esaminiamo nel dettaglio questa tre categorie, dette rispettivamente fogli di stile incorporati, fogli di stile interni ed in fine fogli di stile esterni.

Fogli di stile incorporati

Questa pratica è in genere la meno usata, dato che finisce per equivalere al normale metodo di formattazione Html, anche se conserva la potenza e la versatilità dei Css rispetto all'Html, ma può tornare utile per formattare un singolo elemento che, per necessità, deve essere diverso dai suoi simili, già definiti in un foglio di stile globale (interni, esterni).

Si utilizza l'attributo Html style all'interno del Tag che si intende formattare con quel criterio, ecco un esempio: 

<div style="color: #FF0000;">Questo testo apparirà in rosso</div>
Al momento non ci si preoccupi della sintassi che potrebbe non risultare del tutto chiara o immediata, nel corso delle lezioni successive saranno ampiamente spiegate tutte le forme sintattiche Css e tutti i possibili comandi da utilizzare.

Fogli di stile interni

Questo metodo è più utilizzato ma non ancora ottimale, consiste nell'inserire un blocco di stile all'interno dell'header della pagina, definendo un unico stile per i singoli elementi contenuti, i Tag di testo, i link, le tabelle, ecc.

Si utilizza il Tag <style> e </style> con l'attributo opzionale (io personalmente lo utilizzo...) type="text/css".

Un esempio servirà a chiarire le idee: 
<html>
   <head>
      <title>Il mio primo foglio di stile</title>
      <style type="text/css">
         div { color: #FF0000; font-family: Verdana; }
         a { color: #3366CC; text-decoration: None; }
      </style>
   </head>
<body>

<div>Testo formattato con i Css</div>
<a href="#">Link formattato con i Css</a>

</body>
</html>
Fogli di stile esterni

Terza modalità di utilizzo dei Css, senza dubbio la più efficace, è rappresentata dall'inclusione di un file esterno con estensione .css, salvato come Tutti i file [*.*].

La stringa di codice che si utilizza per richiamare il file esterno nella pagina, ad esempio style.css è la seguente: 
<link rel="stylesheet" type="text/css" href="style.css">
nel caso il file si trovi nella stessa cartella del file Html che lo richiama, se invece si trovasse nella cartella stili la stringa sarebbe la seguente: 
<link rel="stylesheet" type="text/css" href="stili/style.css">
Questo metodo è senza il migliore perchè rende possibile richiamare il file di stile in ogni pagina ottenendo ovunque l'effetto stilistico progettato nel file esterno, e li dove dovesse essere apportato un cambiamento globale ad una tipologia di elementi, ad esempio il colore dei link, è possibile cambiare lo stile ovunque con una sola mossa.

Ultima nota, nel file esterno non bisogna utilizzare i Tag <style> e </style>, ma solo codice Css.

IN EVIDENZA
Una slidegallery con jQuery Pagamenti online con PayPal e PHP Breve guida a jQuery Effetto ombra su testo con Photoshop Guadagna col tuo sito grazie a TradeD... Guida XHTML Riscrivere le URL con Asp Riavviare IIS HTTP 500 internal server error Generare password casuali in Javascri... Errore 80004005: Cannot update. Datab... Introduzione ad Ajax ed Asp con Jscri... Referenze dei Tag Html Stringhe di connessione via ODBC e Ol... Referenze dei fogli di stile Css Le espressioni regolari in Javascript
HOT LINKS
Servizi per Webmaster E-Commerce News Manager Newsletter Corsi online eBooks PC Guadagna col sito Hosting 20 euro Reg. domini Email gratis FAX via email Tlefonare col PC ADSL Alice ADSL FastWeb