| <!DocType html> | |
| <html language="en-us"> | |
| <head> | |
| <meta charset="utf-8"/> | |
| <title>HTML5 Semantic Tags</title> | |
| <script> | |
| function f1() | |
| { | |
| var obj=document.getElementById("d1"); | |
| obj.showModal(); | |
| } | |
| function f2() | |
| { | |
| var obj=document.getElementById("d1"); | |
| obj.close(); | |
| } | |
| function f3() | |
| { | |
| var obj=document.getElementById("d1"); | |
| obj.open(); | |
| } | |
| </script> | |
| </head> | |
| <style> | |
| #d1::backdrop | |
| { | |
| background-color:pink; | |
| opacity:0.5; | |
| } | |
| #d1 | |
| { | |
| width:"350px"; | |
| border-top:20px solid orange; | |
| border-bottom:20px solid orange; | |
| border-radius:25px; | |
| text-align:center; | |
| margin-top:250px; | |
| } | |
| </style> | |
| <body > | |
| <h1>Usage of HTML5 Dialog Tag</h1> | |
| <hr> | |
| <input type="button" value="Show Dialog" onclick="f1()"/> | |
| <br><br> | |
| <dialog id="d1"> | |
| <h2>Web UI Course List</h2> | |
| <ol style="text-align:left"> | |
| <li>HTML5</li> | |
| <li>CSS3</li> | |
| <li>ANGULAR JS</li> | |
| <li>JQUERY</li> | |
| <li>BOOTSTRAP</li> | |
| </ol> | |
| <input type="button" value="Exit" onclick="f2()"/> | |
| <a href="images (4).jpg"><input type="button" value="Save" onclick="f3()"/></a> | |
| </dialog> | |
| </body > | |
| </html> |
Monday, 21 August 2017
Usage of HTML5 Dialog Tag
Subscribe to:
Post Comments (Atom)
No comments:
Post a Comment