HTML 教程

HTML 属性

HTML 标签列表

HTML API

HTML 案例

HTML 颜色

HTML5 进阶

HTML 其它

HTML 面试问题

HTML <dialog> 对话框标签

HTML <dialog> 标签用于在网页上创建一个新的弹出对话框。这个标签代表一个对话框或其他像窗口这样的交互式组件。

<dialog> 元素使用一个名为 open 的布尔属性来激活元素并促进用户与其交互。

HTML 对话框是 HTML5 中引入的新标签。

HTML 对话框标签示例

<!DOCTYPE>
<html>  
<body>  
<div>  
<dialog id="myFirstDialog" style="width:50%;background-color:#F4FFEF;border:1px dotted black;">  
<p><q>I am so clever that sometimes I don't understand a single word of what I am saying.   
</q> - <cite>Oscar Wilde</cite></p>  
<button id="hide">Close</button>  
</dialog>  
<button id="show">Show Dialog</button>  
</div>  
  
<!-- JavaScript to provide the "Show/Close" functionality -->  
<script type="text/JavaScript">  
(function() {    
    var dialog = document.getElementById('myFirstDialog');    
    document.getElementById('show').onclick = function() {    
        dialog.show();    
    };    
    document.getElementById('hide').onclick = function() {    
        dialog.close();    
    };    
})();   
</script>  
</body>
</html>

输出：

HTML 对话框标签还支持 HTML 中的全局和事件属性。

支持浏览器

元素ChromeIEFirefoxSafariOpera
<dialog>YesYesYesYesYes


上一主题 HTML <dfn> 标签 下一主题 HTML <dir> 标签
  • 使用社交账号登录,本站支持
全部评论(0)

便捷工具