HackMD - Collaborative Markdown Knowledge Base

<!doctype html> <html> <head> <meta charset="utf-8"> <title>測試文件</title>  <link href="https://fonts.googleapis.com/css?family=Noto+Sans+TC&display=swap" rel="stylesheet"> <style> html,body,div,ul{ margin:0; padding: 0; } #menu{ position: fixed; background:red; width:100%; height:100px; top:0; z-index: 1; } #menu li{ float: left; line-height: 100px; margin-left: 20px; list-style-type: none; font-size: 40px; } #div1{ box-sizing:border-box; text-align:justify; float: left; background:green; padding-top: 100px; left: 0px; width: 55%; height: 700px; } #div2{ position: relative; background: blue; box-sizing:border-box; float: right; padding-top: 100px; left: 0px; width: 45%; height: 1000px; font-size: 30px; color: #fff; } #div3{ clear:both; position: relative; background: yellow; left: 0px; top: 0px; width: 100%; height: 100px; } #box{ width:45%; height:30%; background: black; margin: 100px -10px -90px 20px; float: left; } .box500{ height: 500px; background: red; width:500px; } </style> </head> <body> <button onclick="hint()">My 生日</button> <script language="javascript"> function hint(){ var question = prompt('請問我的生日是幾號?',"") if (question!= null && question != "") { alert("您回答的是\t" + question+"\t") }else{ alert("您沒輸入") } } </script> <ul id = "menu"> <li>Menu1</li> <li>Menu2</li> <li>Menu3</li> </ul> <div id = "div1" class="box500"> <div id = "box"> </div> <div id = "box"> </div> <div id = "box"> </div> <div id = "box"> </div> </div> <div id = "div2" class="box500"> <p>Prompt會跳出一個方塊可以輸入值~!</p> <input type="button" value="點我" onclick="hint()" id="btn"> <br> <p>alert 跟 confirm會跳出消息的方塊，prompt會跳出一個方塊可以輸入值~!</p> </div> <div id = "div3" class="box500"> </div> </body> </html>