I fogli di stile (2)

F. Giovanetti

Liceo di Luino

Applicare gli stili solo ad alcuni elementi

• Abbiamo visto come associare uno stile ad un marcatore (ad esempio a per i link)
• Spesso non vorremo applicare la stessa presentazione grafica a tutti i link
• In questo caso sarà utile utilizzare le classi:
  • <a href="#" class="esempio">testo</a>
  • associato al css a.esempio {...}

Scelta dei nomi delle classi

• La scelta dei nomi delle classi è arbitraria ma in genere è consigliabile usare un nome che richiami la funzione logica all'interno del testo
• le classi possono essere usati con tutti i marcatori
• la regola css selettore.nome_classe {...} ha una specificità maggiore rispetto a selettore {...} e prevale su di essa

id

• L'attributo id si utilizza come class, ma a differenza di questo non può essere usato più di una volta all'interno di uno stesso
• si usa molto con il marcatore div: <div id="nome">testo</div>
• e si associa ad una regola CSS con la sintassi div#nome {...}

Box

• A un div in particolare possiamo associare:
  • bordi,
  • margini,
  • padding

Box model

• Margin indica lo spazio tra il bordo e gli altri contenuti della pagina
• Padding indica lo spazio tra il contenuto e il bordo

Credits e licenza

• Questa presentazione (nella versione proiettata) è realizzata con S5 di Eric Meyer
• Si tratta di uno strumento per realizzare presentazioni scrivendo semplicemente un file html, quindi con strumenti standard e non proprietari
• Eccetto dove diversamente specificato, i contenuti di questa presentazione sono rilasciati sotto Licenza Creative Commons