Come costruire un foglio di stile CSS interno

Cosa sono i fogli di stile interni

I fogli di stile interni sono stili posizionati nel documento HTML. Questi stili influenzano solo il documento in cui si trovano e non possono essere referenziati da nessun altro documento Web.

Vantaggi dei fogli di stile interni

I fogli di stile interni influenzano solo la pagina in cui si trovano.
- Se stai lavorando su un sito di grandi dimensioni e hai bisogno di testare gli stili prima di caricarli sul sito nel suo insieme, i fogli di stile interni possono essere un ottimo strumento. Ti permettono di testare gli stili nel contesto dell'intero sito senza rompere alcuna pagina tranne quella che stai testando.
I fogli di stile interni possono utilizzare classi e ID.
- A differenza degli stili in linea, i fogli di stile interni possono ancora trarre vantaggio da classi, ID, fratelli e altre relazioni di elementi.
I fogli di stile interni non richiedono il caricamento di più file.
- Ciò è particolarmente utile quando lavori con cose come email o chioschi in cui hai solo un file HTML disponibile per la modifica. Uso spesso gli stili incorporati quando non sono sicuro di quale URL debba essere caricato un foglio di stile in un CMS: mantenere gli stili con il documento significa che so quali stili influenzano quel documento.
Gli stili interni possono avere maggiore precedenza rispetto ai fogli di stile esterni.
- Questo è determinato dall'ordine in cui vengono caricati i fogli di stile esterni. Lo sviluppatore Web della pagina ha il controllo su dove verranno posizionati gli stili interni nella testa del documento. Se sono posizionati dopo il collegamento a stili esterni, avranno una precedenza più alta nella cascata e supereranno il foglio di stile esterno.

Svantaggi dei fogli di stile interni

Influenzano solo la pagina su cui si trovano.
- Se si desidera utilizzare gli stessi stili in diversi documenti, è necessario ripeterli per ogni pagina (o collegarli a un foglio di stile esterno).
I fogli di stile interni aumentano i tempi di caricamento della pagina.
- Ogni pagina che ha un foglio di stile interno deve caricare e analizzare le informazioni del foglio di stile ogni volta che viene caricata la pagina. I fogli di stile esterni vengono memorizzati nella cache dai browser, il che migliora i tempi di caricamento per ogni pagina dopo il caricamento del primo.