A style incorporato Cioè quando ad un determinato stile fanno riferimento più elementi (tags) html uguali nella stessa pagina. Sarebbe estremamente dispersivo, oltre che laborioso, definire sempre lo stesso stile più volte all’interno della stessa pagina visto che servirebbe sempre per lo stesso identico scopo. Molto meglio definirlo una sola volta, ad inizio pagina. Così facendo tutti gli elementi interessati di quella pagina seguiranno lo stesso stile.
In questo caso le istruzioni non dovranno più essere inserite all’interno di uno specifico elemento come abbiamo visto nella spiegazione in linea ma saranno dichiarate ad inizio pagina, usando il tag (tags) <style> e </style> posto all’interno della sezione <head> </head>
Questo metodo non impedisce di fare uso anche di eventuali definizioni di stile in linea, anzi, queste avrebbero priorità sulle dichiarazioni di stile inserite ad inizio pagina.
Da notare che in questo modo si renderanno necessarie le parentesi graffe per delimitare i vari blocchi di istruzioni relativi agli elementi interessati, cosa che non serviva per gli styli in linea.
Facendo riferimento ancora all’esempio precedente:
<style type="text/css">
<!--
p {
text-align: justify;
text-indent: 12px;
}
-->
</style>
Adesso tutto ciò che si troverà all’interno di qualsiasi paragrafo <p> definito con la consueta forma html <p> … </p> subirà le impostazioni dello stile dichiarato ad inizio pagina, a meno che non venga creato uno stile in linea per uno o più determinati paragrafi, i quali, come ho detto sopra, avrebbero priorità rispetto a quanto definito nello style ad inizio pagina.
Ripeto ancora una volta l’importanza della chiusura degli elementi aperti, anche nei casi in cui si trattasse di elementi come <p> che in html non necessiterebbero della relativa chiusura </p> Non chiudere un elemento significa non porre fine allo stile ad esso associato ma estenderlo a tutto il documento, cosa sbagliata e quasi mai voluta.
In questo contesto sono proprio loro: i tags chiusi, a decretare la fine dello style oltre a quella del paragrafo. Dimenticarli significa dire al browser di estendere i parametri dello style a tutto il resto del documento.
Spiegando il codice dell’esempio: i due elementi di commento <!– e –>, posti ad inizio e fine blocco, sono gli stessi adoperati in html e servono per fare ignorare lo style a tutti quei browser obsoleti che non dovessero supportarlo. Da non usare mai per lasciare commenti all’interno della dichiarazione di stile, non è come in HTML, se serve commentare all’interno di un foglio di style si adoperano /* (barra e asterisco) per inizio commento e */ (asterisco barra) per la sua fine.
<style type="text/css">
<!--
p {
text-align: justify; /* commento per allineamento giustificato */
color: #ff0000; /* commento per colore rosso */
}
-->
</style>
La stesura del codice io l’ho scritta così, con i ritorni a capo, solo per dargli un certo ordine ma nessuno vieta che possa essere scritta tutta su una riga, l’importante è rispettare i simboli: parentesi, due punti, spazi, punti e virgola.
<style type="text/css">
<!--
p {text-align: justify; color: #ff0000;}
-->
</style>
Nell’esempio è stato adoperato l’elemento (tag) <p> e senza parentesi angolari, nei fogli di style infatti si deve usare il tag o elemento ma non le sue parentesi angolari che invece fanno parte di html. Avrete sicuramente capito che al posto di p potevamo usare qualsiasi altro elemento valido di html: b, strong, H1, table, ecc. ecc.
Vista questa geniale possibilità, perché non ridefinire elementi di html che non si adoperano perchè non piacciono o personalizzare quelli più adoperati per rendere il tutto più gradevole?
Così facendo sarebbe come avere a disposizione dei nuovi comandi html, o meglio, dei nuovi elementi, con in più il fatto di averli personalizzati a proprio piacere, se non è versatilità questa.
Personalmente faccio poco uso di elementi ridefiniti, preferisco molto di più usare delle “classi” (le vedremo più avanti) che creo sul momento e alle quali associo nomi decisamente più significativi, per me, per meglio capire a cosa mi servono realmente. Non esistono limiti al numero di classi definibili dall’utente, per cui potrei avere un solo paragrafo con dieci classi diverse, evviva la fantasia di ognuno di noi.
Continua: Style nel file esterno
Se avete domande da fare potete scrivere sul forum di supporto, gratuito e aperto a tutti.