En este artículo, crearemos un cuadro de diálogo o ventana usando la etiqueta <dialog> en el documento. Esta etiqueta se utiliza para crear cuadros de diálogo emergentes y modelos en una página web. Esta etiqueta es nueva en HTML5.
Sintaxis:
<dialog open> Contents... </dialog>
Ejemplo 1:
<!DOCTYPE html>
<html>
<head>
<title>
How to define a dialog
box or window?
</title>
<style>
dialog {
color: green;
font-size: 30px;
font-weight: bold;
font-style: italic;
}
body {
text-align: center;
}
</style>
</head>
<body>
<h1>
<dialog> tag
</h1>
<dialog open>
Welcome to GeeksforGeeks
</dialog>
</body>
</html>
Producción:
Ejemplo 2:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>
How to define a dialog
box or window?
</title>
<style>
table,
th,
td {
border: 1px solid red;
}
</style>
</head>
<body>
<center>
<h2>GeeksForGeeks</h2>
<h2>
How to define a
dialog box or window
</h2>
<dialog open>
This is an open dialog window
</dialog>
</center>
</body>
</html>
Producción:
Los navegadores compatibles se enumeran a continuación:
- Google Chrome
- explorador de Internet
- Firefox
- Ópera
- Safari
Publicación traducida automáticamente
Artículo escrito por ManasChhabra2 y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA