Attributi class e id
Class e id sono gli attributi che useremo di più quando inizieremo il CSS: identificano gli elementi a cui applicare uno stile.
<p class="testo-evidenziato">Un paragrafo con una classe.</p>
<h1 id="titolo-principale">Un titolo con un ID.</h1>
class: riutilizzabile su più elementi, per applicare lo stesso stile a un gruppo.id: deve essere univoco nella pagina — un solo elemento può averlo. Si usa anche per i link ad ancora, come abbiamo visto nella Lezione 3.
Entità HTML
Alcuni caratteri hanno un significato speciale in HTML (come < e >, che aprono e chiudono i tag) e non possono essere scritti direttamente nel testo: si usano le entità, un codice che il browser converte nel simbolo corretto.
| Entità | Simbolo | Significato |
|---|---|---|
< | < | minore di |
> | > | maggiore di |
& | & | e commerciale |
© | © | copyright |
| (spazio) | spazio non divisibile |
€ | € | euro |
<p>Il prezzo è di 20 € (per usare il simbolo & l'entità serve anche per l'e commerciale).</p>
Gli emoji invece si possono scrivere direttamente nel codice come qualsiasi carattere Unicode 🎉 — funzionano perché abbiamo dichiarato <meta charset="UTF-8"> nel <head>.
Un primo sguardo a JavaScript
HTML descrive la struttura, CSS lo stile: JavaScript è il terzo linguaggio del web, quello che rende una pagina interattiva (un menu che si apre al click, una validazione di un form, un contenuto che si aggiorna senza ricaricare la pagina).
In questo corso base non scriveremo JavaScript, ma è utile sapere come si collega a una pagina, perché lo vedrai spesso nei siti reali:
<script src="script.js"></script>
Il tag <script> va tipicamente prima della chiusura di </body>, così la pagina si carica prima di eseguire il codice. Se un giorno vorrai approfondire, JavaScript è il passo naturale dopo HTML e CSS.
Esercitazione pratica
Aggiungi a una pagina esistente una classe CSS di prova su due elementi diversi, un ID su un titolo, e scrivi una frase che utilizzi almeno tre entità HTML diverse.