Esempio
Un menu contestuale con diverse <menuitem> elementi:
<menu type="context" id="mymenu">
<menuitem label="Refresh"
onclick="window.location.reload();" icon="ico_reload.png">
</menuitem>
<menu label="Share on...">
<menuitem label="Twitter"
icon="ico_twitter.png"
onclick="window.open('//twitter.com/intent/tweet?text='+window.location.href);">
</menuitem>
<menuitem label="Facebook" icon="ico_facebook.png"
onclick="window.open('//facebook.com/sharer/sharer.php?u='+window.location.href);">
</menuitem>
</menu>
<menuitem label="Email This Page"
onclick="window.location='mailto:?body='+window.location.href;"></menuitem>
</menu>
Prova tu stesso " Definizione e utilizzo
Il <menu> tag definisce un elenco / menu di comandi.
Il <menu> tag viene utilizzato per i menu di contesto, le barre degli strumenti e della messa in controlli e comandi di forma.
Supporto per il browser
I numeri nella tabella indicano la prima versione del browser che supporta pienamente l'elemento.
Elemento | |||||
---|---|---|---|---|---|
<menu> | Non supportato | Non supportato | 8.0 (Solo menu contestuale) | Non supportato | Non supportato |
Nota: Il <menu> tag è supportato solo in Firefox, e funziona solo per i menu contestuali.
Suggerimenti e Note
Suggerimento: usare i CSS per lo stile elenchi di menu.
Differenze tra HTML 4.01 e HTML5
Il <menu> elemento è stato sconsigliato in HTML 4.01.
Il <menu> elemento viene ridefinito in HTML5.
attributi
= Nuovo in HTML5.
Attributo | Valore | Descrizione |
---|---|---|
label | text | Specifica un'etichetta visibile per il menu |
type | list toolbar context | Specifica quale tipo di menu per visualizzare |
attributi globali
Il <menu> tag supporta anche l' Attributi globali in HTML .
Attributi eventi
Il <menu> tag supporta anche l' evento Attributi in HTML .
Pagine correlate
Di riferimento HTML DOM: Object Menu
Impostazioni predefinite CSS
La maggior parte dei browser visualizzerà il <menu> elemento con i seguenti valori di default:
menu {
display: block;
list-style-type: disc;
margin-top: 1em;
margin-bottom: 1em;
margin-left: 0;
margin-right: 0;
padding-left: 40px;
}