Programmazione Web » Css » Cambiare stile in base al dispositivo utilizzato
Cambiare stile in base al dispositivo utilizzato
Difficoltà:
Scritto da Alberto Giuliani
Sito Web: http://www.agwebsolutions.it 
Questo tutorial è stato letto 1181 volte
In questo tutorial vedremo come migliorare la visibilità di una pagina web in base al dispositivo utilizzato.
Al giorno d'oggi un sito web può essere consultato tramite diversi apparecchi: pc, palmari, cellulari, dispositivi per non vedenti, tv, ecc.
Basta pensare che ognuno di questi dispositivi visualizzerà il nostro sito in maniera diversa, per rendersi conto che è necessario impostare una visualizzazione corretta per ognuno dei suddetti apparecchi.
I CSS mettono a disposizione l'attributo MEDIA del tag <style> che assegna un determinato foglio di stile all'interpretazione unica di un particolare dispositivo.
Ecco i dispositivi supportati dall'attributo MEDIA:
- all: tutti i dispositivi;
- aural: sintetizzatori vocali (non vedenti);
- braille: dispositivi braille (non vedenti);
- embossed: stampanti braille;
- handheld: dispositivi palmari;
- print: stampati e 'anteprima di stampa';
- projection: proiettori per presentazioni;
- screen: lo schermo di un pc;
- tty: dispositivi con caratteri a larghezza fissa;
- tv: televisori.
Supponiamo di avere un foglio di stile "computer.css" e di volerlo assegnare alla lettura dei pc. Ecco il codice:
<style type="text/css" src="computer.css" media="screen" />
Esso sarà interpretato solo dai PC, mentre sarà ignorato dagli altri dispositivi.
In questo modo possiamo essere sicuri della visualizzazione del nostro sito da parte di qualsiasi dispositivo e abbiamo certamente migliorato l'accessibilità del nostro sito.
Aggiungi questo tutorial ai preferiti
