How to create an HTML Dialog Box
This Blog You Will Learn
ஃ what is the <dialog> element
ஃ Advantage of HTML Dialog Box
ஃ Syntax of HTML <dialog> tag
ஃ Explain Program
ஃ Explain Program
what is the <dialog> element
- <dialog> box tag is html element that represents a dialog box or also called modal window.
- <dialog> Element HTML represents modal box or non-modal box.
- <dialog> box in HTML small window pop box display /appears show web page.
- <dialog> box use show warning,alerts,confirmations,forms from the current page.
- popups that open in a new browser window <dialog> box.
- <dialog> box use native HTML element .
- Display information for user input.
- Appears main page content.
Advantage of HTML Dialog Box
- Built-in HTML elelment they are not library required.
- Easy to use and control.
- Better Accessibility.
Syntax of HTML <dialog> tag
<dialog open> .... Create HTML Dialog box..... </dialog>
<dialog open> .... Create HTML Dialog box..... </dialog>
How to create an HTML Dialog Box
Explain Program
Step 1]
<!DOCTYPE html>
- This declare the document type.
- browser that the document is written in html
Step 2 ]
<html>.... . </html>
- html is the root element of the html page.
- Every thing inside it is part of the webpage.
Step 3]
<head>
<title> HTML dialog box </title>
</head>
- <head> section
- head section contains metadata about page. not visible on the page itself.
- <title> tag title section set the title of the page shows the browser tab.
Step 4]
<body> <p> Hii Friend</p> <p>Iearn HTML dialog box </p> <P> Use The https://webdesigningtheory.blogspot.com </P> <P> Easy to learn </P> <P> Create HTML dialog box</P> <P> with example </P> <P> and explanation</P>
<body>
<p> Hii Friend</p>
<p>Iearn HTML dialog box </p>
<P> Use The https://webdesigningtheory.blogspot.com </P>
<P> Easy to learn </P>
<P> Create HTML dialog box</P>
<P> with example </P>
<P> and explanation</P>
- Use Paragraphs tag <P> Using.
- HTML <p> tag used to write paragraph text on the webpage.
Step 5]
<dialog open> Create HTML Dialog box</dialog>
- HTML <dialog> tag.
- HTML <dialog> tag use create a popup box on webpage.
- HTML open attribute visible automatically webpage
Step 6]
Closing tag
</body>
</html>
How to create an HTML Dialog Box
Example
<!doctype html>
<html> <head> <title> HTMl dialog box</title> </head> <body> <p> Hii Friend</p> <p>Iearn HTML dialog box </p> <P> Use The https://webdesigningtheory.blogspot.com </P> <P> Easy to learn </P> <P> Create HTML dialog box</P> <P> with example </P> <P> and explanation</P> <dialog open> Create HTML Dialog box</dialog> </body> </html>
<!doctype html>
<html>
<head>
<title> HTMl dialog box</title>
</head>
<body>
<p> Hii Friend</p>
<p>Iearn HTML dialog box </p>
<P> Use The https://webdesigningtheory.blogspot.com </P>
<P> Easy to learn </P>
<P> Create HTML dialog box</P>
<P> with example </P>
<P> and explanation</P>
<dialog open> Create HTML Dialog box</dialog>
</body>
</html>
How to create an
How to create an HTML Dialog Box
Output
