Concetti Chiave
- Il CSS consente di separare la struttura e il contenuto di una pagina web dalle sue caratteristiche visive, migliorando la gestione del layout.
- Esistono tre tipi di CSS: in linea, incorporati e collegati, ognuno con modalità diverse di applicazione degli stili.
- I fogli di stile collegati sono memorizzati in file esterni e possono essere caricati utilizzando attributi come rel, href, type e media.
- L'attributo media permette di specificare il supporto per cui un particolare foglio di stile è progettato, come schermi o stampe.
- Il selettore universale (*) permette di applicare stili a tutti gli elementi presenti nella pagina HTML.
Il CSS (Cascading Style Sheet) è un documento testuale che definisce il layout delle pagine HTML. Vantaggi dei CSS: 1) separare la struttura e il contenuto della pagina web dalle sue caratteristiche di visualizzazione; 2) maggiore controllo sulla rappresentazione di documenti omogenei; 3) indipendenza dal dispositivo di visualizzazione.
Tipi di CSS
Esistono tre tipi di CSS: 1) in linea (le proprietà di stile vegono innestate direttamente in corrispondenza del tag che si desidera controllare; 2) incorporati (la struttura di ogni stile viene definita all’interno dell’intestazione del documento); 3) collegati (il foglio di stile è memorizzato in un file esterno separato dal documento). Per caricare un foglio esterno si usa il tag : 1) rel (descrive il tipo di relazione tra il documento e il file collegato; 2) href (definisce l’URL del foglio di stile); 3) type (identifica il tipo di dati da collegare (text/css)); 4) media (identifica il supporto cui applicare un particolare foglio di stile). I fogli di stile incorporati sono inseriti direttamente nel documento HTML tramite l’elemento all’interno della sezione ad>. Nei fogli di stile in linea la dichiarazione avviene a livello dei singoli tag contenuti nella pagina HTML. L’attributo media permette di impostare un foglio di stile per ogni supporto su cui la nostra pagina verrà distribuita (all, screen, print,…). Selettore universale (*) seleziona tutti gli elementi. Proprietà di sfondo (background-color, background-image, background-repeat, background-attachment(imposta il comportamento dell’immagine di sfondo), background-position (definisce il punto in cui verrà piazzata un’immagine di sfondo))
Domande da interrogazione
- Quali sono i principali vantaggi dell'utilizzo dei CSS?
- Quali sono i tre tipi di CSS e come si differenziano?
- Come si utilizza l'attributo media nei fogli di stile?
I CSS offrono vantaggi significativi come la separazione della struttura e del contenuto dalla visualizzazione, un maggiore controllo sulla rappresentazione di documenti omogenei e l'indipendenza dal dispositivo di visualizzazione.
I tre tipi di CSS sono: in linea, dove le proprietà di stile sono innestate nei tag; incorporati, dove gli stili sono definiti nell'intestazione del documento; e collegati, dove il foglio di stile è memorizzato in un file esterno.
L'attributo media consente di applicare un foglio di stile specifico per diversi supporti, come all, screen o print, permettendo una personalizzazione della visualizzazione in base al dispositivo utilizzato.