Ma cosa si intende per stile? Uno stile è un gruppo di attributi di formattazione che definiscono l'aspetto di una parte di testo all'interno di un singolo documento.
Puoi utilizzare un foglio di stile CSS per controllare molti documenti contemporaneamente e comprendere in un unico foglio tutti gli stili di un documento. Attraverso l'uso combinato di un foglio di stile CSS e uno stile HTML hai il vantaggio di collegare più documenti. Di conseguenza quando vuoi aggiornare delle caratteristiche di formattazione delle pagine web devi solo modificare il foglio di stile e automaticamente modificherai la formattazione di tutti documenti che utilizzano quello stile CSS.
La formattazione HTML manuale ha la precedenza rispetto alla formattazione applicata da uno stile CSS. Per fare in modo che gli stili CSS controllino la formattazione di un paragrafo, è necessario eliminare tutta la formattazione HTML manuale o gli stili HTML.
I documenti HTML possono contenere regole di stile direttamente al loro interno o possono importare i fogli di stile.
Separare i fogli di stile dai documenti HTML offre svariati benefici:
- puoi condividere i fogli di stile per un gran numero di documenti (e siti).
- puoi cambiare il foglio di stile senza che ciò richieda modifiche al documento.
Possiamo dividere i fogli di stile in 3 categorie:
- fogli di stile in linea: con questo metodo puoi utilizzare uno stile da applicare ad un singolo tag HTML.
- fogli di stile interni: con questo metodo definisci lo stile non per il singolo TAG, ma per tutta la pagina.
- fogli di stile esterni: con questo metodo lo stile che vai a definire può essere utilizzato da più pagine web, infatti la definizione viene data all'interno di un file esterno (con estensione .css ) che viene linkato alla pagina con un apposito costrutto.
La sintassi che devi usare nei fogli di stile è la seguente :
- inserisci gli attributi dentro le parentesi graffe { }
- separa gli argomenti consecutivi dal segno punto e virgola (;) invece che dalla virgola
- usa i due punti (:) al posto del segno uguale (=)
- separa con un trattino (-) gli attributi composti da piu' termini
- Quando un attributo è considerato proprieta' di un oggetto eliminalo e trasforma da minuscole in maiuscole le iniziali dei termini (per esempio: font-style diventa fontStyle)
Per inserire i fogli di stile su una pagina html bisogna inserire tra i TAG <head> il TAG <style> in questo modo :
<head>
<style type="text/css">
...
</stile>
</head>
Per qualsiasi dubbio rimandiamo alla guida ai CSS di HTML.it e alla sezione CSS di PRO.HTML.it