tutorial pengembangan web terbaru
 

HTML <menu> Tag


Contoh

Sebuah menu konteks dengan berbagai <menuitem> elemen:

<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>
Cobalah sendiri "

Definisi dan Penggunaan

The <menu> tag mendefinisikan daftar / menu perintah.

The <menu> tag digunakan untuk menu konteks, toolbar dan untuk listing bentuk kontrol dan perintah.


Dukungan Browser

Angka-angka dalam tabel menentukan versi browser pertama yang sepenuhnya mendukung elemen.

Elemen
<menu> Tidak didukung Tidak didukung 8,0
(Hanya konteks menu)
Tidak didukung Tidak didukung

Catatan: <menu> tag hanya didukung di Firefox, dan hanya bekerja untuk menu konteks.


Tips dan Catatan

Tip: Gunakan CSS untuk gaya daftar menu.


Perbedaan Antara HTML 4.01 dan HTML5

The <menu> elemen itu ditinggalkan dalam HTML 4.01.

The <menu> elemen didefinisikan ulang di HTML5.


atribut

= Baru di HTML5.

Atribut Nilai Deskripsi
label text Menentukan label terlihat untuk menu
type list
toolbar
context
Menentukan jenis menu untuk menampilkan

Atribut global

The <menu> tag juga mendukung Atribut Global di HTML .


Atribut acara

The <menu> tag juga mendukung Acara Atribut di HTML .


Pages terkait

Referensi HTML DOM: menu Object


Pengaturan Default CSS

Kebanyakan browser akan menampilkan <menu> elemen dengan nilai default berikut:

menu {
    display: block;
    list-style-type: disc;
    margin-top: 1em;
    margin-bottom: 1em;
    margin-left: 0;
    margin-right: 0;
    padding-left: 40px;
}