Gli ultimi tutorial di sviluppo web
 

HTML <menu> Tag


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;
}