Exemple
Un menu contextuel avec différentes <menuitem> éléments:
<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>
Essayez - le vous - même » Définition et utilisation
Le <menu> balise définit une liste / menu de commandes.
Le <menu> tag est utilisé pour les menus contextuels, les barres d' outils et d'inscription des contrôles de formulaire et les commandes.
support du navigateur
Les chiffres du tableau indiquent la première version du navigateur qui prend en charge totalement l'élément.
Élément | |||||
---|---|---|---|---|---|
<menu> | Non supporté | Non supporté | 8.0 (Uniquement les menus de contexte) | Non supporté | Non supporté |
Remarque: Le <menu> balise est uniquement pris en charge dans Firefox, et il ne fonctionne que pour les menus contextuels.
Trucs et astuces
Astuce: Utilisez les CSS pour coiffer les listes de menu.
Différences entre HTML 4.01 et HTML5
Le <menu> élément a été dépréciée dans HTML 4.01.
Le <menu> élément est redéfinie en HTML5.
Les attributs
= Nouveau en HTML5.
Attribut | Valeur | La description |
---|---|---|
label | text | Indique une étiquette visible pour le menu |
type | list toolbar context | Indique quel type de menu pour afficher |
Attributs globaux
Le <menu> tag soutient également le attributs globaux en HTML .
Attributs de l'événement
Le <menu> tag soutient également l' événement Attributs en HTML .
Pages associées
Référence HTML DOM: Menu Objet
Paramètres par défaut de CSS
La plupart des navigateurs affichent le <menu> élément avec les valeurs par défaut suivantes:
menu {
display: block;
list-style-type: disc;
margin-top: 1em;
margin-bottom: 1em;
margin-left: 0;
margin-right: 0;
padding-left: 40px;
}