，和

元素,其中每個(gè)都會(huì)建立一個(gè)新的獨(dú)立的內(nèi)容區(qū)域，你可以把它作為body的一個(gè)孩子，或者是嵌套的元素，如

或

——兩種元素都有效，如下所示。

默認(rèn)情況下，支持的瀏覽器(Chrome 37+和Opera 27+)會(huì)以隱藏的形式呈現(xiàn)

元素，只有調(diào)用JavaScript的show()或showModal()方法才可以顯現(xiàn)，調(diào)用close()方法再次將其隱藏。通常情況下，我們會(huì)在一個(gè)click事件上執(zhí)行此方法，如下所示：

var $accountDelete = $('#delete-account'), 
      $accountDeleteDialog = $('#confirm-delete'); 
  $accountDelete.on('click', function() { 
      $accountDeleteDialog[0].showModal(); 
  }); 
  $('#cancel').on('click', function() {
      $accountDeleteDialog[0].close(); 
  });

自定義樣式：

像大多數(shù)其他的元素一樣，對(duì)話框可以很容易覆蓋瀏覽器的默認(rèn)樣式。所以，你可以自定義其樣式。例如，使對(duì)話框邊框更薄，使邊角圓潤(rùn)，并添加陰影效果等。

此外，當(dāng)

元素以模態(tài)顯示時(shí)(使用ShowModal()方法)，我們會(huì)添加一個(gè)額外的偽元素::backdrop。::backdrop元素會(huì)立即駐留在對(duì)話框下面，覆蓋整個(gè)視區(qū)和下方的其它元素。

瀏覽器支持：

目前，只有 Chrome 和 Safari 6 支持

標(biāo)簽。

感謝各位的閱讀！關(guān)于使用HTML5中dialog來實(shí)現(xiàn)模擬彈窗的方法就分享到這里了，希望以上內(nèi)容可以對(duì)大家有一定的幫助，讓大家可以學(xué)到更多知識(shí)。如果覺得文章不錯(cuò)，可以把它分享出去讓更多的人看到吧！

另外有需要云服務(wù)器可以了解下創(chuàng)新互聯(lián)scvps.cn，海內(nèi)外云服務(wù)器15元起步，三天無理由+7*72小時(shí)售后在線，公司持有idc許可證，提供“云服務(wù)器、裸金屬服務(wù)器、高防服務(wù)器、香港服務(wù)器、美國(guó)服務(wù)器、虛擬主機(jī)、免備案服務(wù)器”等云主機(jī)租用服務(wù)以及企業(yè)上云的綜合解決方案，具有“安全穩(wěn)定、簡(jiǎn)單易用、服務(wù)可用性高、性價(jià)比高”等特點(diǎn)與優(yōu)勢(shì)，專為企業(yè)上云打造定制，能夠滿足用戶豐富、多元化的應(yīng)用場(chǎng)景需求。

新聞名稱：使用HTML5中dialog來實(shí)現(xiàn)模擬彈窗的方法-創(chuàng)新互聯(lián)
轉(zhuǎn)載注明：http://weahome.cn/article/iepgc.html