Summary -

In this topic, we described about the <dialog> tag along with detailed example.

The <dialog> tag is new in HTML5. Used to represent the dialog box or window. Dialog box is part of user interacting application. The <dialog> tag used to represent the dialog box.

The tag can be specified like <dialog></dialog> and with the content of the dialog box inserted between the opening and closing tags. The <dialog> tag to create popup dialogs and modals on a web page. If the <dialog> tag specified with open attribute, it will be loaded once the page loaded.

If the <dialog> tag has no open attribute specified, script needs to be written to determine when the dialog box should be displayed. The dialog tag is currently only supported in Chrome version 37+, Safari 6+ and Opera 24+.

Syntax -

<dialog>.. text here.. </dialog>

Optional Attributes -

AttributeDescriptionValues
OpenSpecifies the dialog element is active or notOpen

Example -

<!DOCTYPE html>
<html>
	<head>
		<title>dialog tag text example.. </title>
	</head>
	<body>
		<p>Line1</p>
		<dialog open>This is an open dialog 
		window</dialog>
	</body>
</html>

Output -

Line1

Line2

Line3

This is an open dialog window

Line4

Line5


Note! The dialog tag is currently only supported in Chrome version 37+, Safari 6+ and Opera 24+.