前端开发攻略---介绍HTML中的＜dialog＞标签，浏览器的原生弹框。

最新推荐文章于 2025-06-06 13:33:49 发布

bbamx.

最新推荐文章于 2025-06-06 13:33:49 发布

阅读量2k

点赞数 11

CC 4.0 BY-SA版权

分类专栏：前端开发攻略文章标签： html 前端 javascript

本文链接：https://blog.csdn.net/nibabaoo/article/details/138284113

1、演示

2、介绍

<dialog> 标签用于定义对话框，即一个独立的窗口，通常用来显示对话框、提示框、确认框等弹出式内容。在对话框中，可以包含文本、表单元素、按钮等内容，用户可以和这些内容进行交互。

3、兼容性

4、示例代码

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
    <style>
      #dialog {
        border: 0;
        width: 500px;
        height: 500px;
        border: 1px solid #000;
      }

      #dialog::backdrop {
        background-color: rgba(0, 0, 0, 0.3);
        backd