Attributi HTML
- Tutti gli elementi HTML possono avere attributi
- Gli attributi forniscono informazioni aggiuntive su un elemento
- Gli attributi sono sempre specificati nel tag di inizio
L’attributo href
Link HTML vengono definite con il <a>
tag. L’indirizzo del collegamento è specificato nel attributo href
:
Esempio
<a href=”https://www.w3schools.com”>Questo è un link</a>
Potrete saperne di più su link e il <a>
tag più avanti in questo tutorial.
L’attributo src
Immagini HTML sono definiti con il tag<img>
.
Il nome della sorgente dell’immagine è specificato nel src
attributi:
Esempio
<img src=”img_esempio.jpg”>
Gli attributi di larghezza e altezza
Immagini in HTML hanno una serie di dimensioni attributi, che specifica la larghezza e l’altezza dell’immagine:
Esempio
<img src=”img_esempio.jpg” width=”500″ height=”600″>
La dimensione dell’immagine è specificato in pixel: larghezza =”500″ indica una larghezza di 500 pixel.
L’attributo alt
L’ alt
attributo specifica un testo alternativo da usare, quando un’immagine non può essere visualizzata.
Esempio
<img src=”img_esempio.jpg” alt=”Esempio errore”>
L’ alt
attributo è utile anche se l’immagine non esiste.
L’attributo di stile
Lo style
attributo viene utilizzato per specificare lo stile di un elemento, come il colore, font, dimensioni, ecc
Esempio
<p style=”color:red”>Paragrafo</p>
L’attributo lang
La lingua del documento può essere dichiarato in <html>
etichetta.
Il linguaggio viene dichiarata con l’attributo lang
.
La dichiarazione di una lingua è importante per le applicazioni di accessibilità (lettori di schermo) e motori di ricerca:
<!DOCTYPE html>
<html lang=”en-US”>
<body>…</body>
</html>
Il titolo attributo
Qui, un attributo title
viene aggiunto all’elemento<p>
. Il valore dell’attributo titolo verrà visualizzato come suggerimento quando il mouse sopra il paragrafo:
Esempio
<p title=”I’m a tooltip”>
Paragrafo
</p>
Vi suggeriamo: Usa le minuscole per Attributi
Lo standard HTML5 non richiede nomi degli attributi in minuscolo.
L’attributo title può essere scritto con caratteri maiuscoli o minuscoli come titolo o TITLE .
Vi suggeriamo: Virgolette nei valori degli attributi
Lo standard HTML5 non richiede virgolette valori degli attributi.
L’ href
attributo dimostrato sopra, può essere scritto senza virgolette:
Sbagliato
<a href=https://www.w3schools.com>
Giusto
<a href=“https://www.w3schools.com“>
A volte è necessario utilizzare le virgolette. Questo esempio non visualizza l’attributo title correttamente, perché contiene uno spazio:
Esempio
<p title=About W3Schools>
citazioni che utilizzano sono i più comuni. citazioni omettendo possono produrre errori.
Virgolette singole o doppie?
Doppi apici intorno valori degli attributi sono i più comuni in HTML, ma le virgolette singole possono anche essere utilizzate.
In alcune situazioni, quando il valore dell’attributo stesso contiene virgolette, è necessario utilizzare gli apici:
<p title=’Mario “IlGrande” Rossi’>
O vice versa:
<p title=”Mario ‘IlGrande’ Rossi”>
Riassunto lezione
- Tutti gli elementi HTML possono avere attributi
- L’attributo
title
fornisce ulteriore “tool-tip” informazioni - L’attributo
href
fornisce informazioni di indirizzo per i collegamenti - Gli attributi
width
eheight
forniscono informazioni di formato per le immagini - L’attributo
alt
fornisce il testo per gli screen reader