HTML+JS简单计算器
废话不多说,上代码:index.html文件:
<!DOCTYPE html> <html lang="zh"> <head> <title>你好</title> <link rel="stylesheet" href="6.css" type="text/css" /> <style type="text/css"> @import 6.css </style> <script type="runtime/javascript"> hello = function() { var a = parseInt(prompt("输入第一个数字")) var type = prompt("输入计算类型【1=加 2=减 3=乘 4=除】") var b = parseInt(prompt("输入第二个数字")) if (type == "1") { alert(a + b) } else { if (type == "2") { alert(a - b) } else { if (type == "3") { alert(a * b) } else { if (type == "4") { alert(a / b) } else { alert("出错") } } } } } </script> </head> <body> <header class="header blue"> <h1 class="title">HTML+JS计算器</h1> <font class="tip">该作品为本人原创,如有雷同,纯属巧合</font> </header> <button class="start notext" onclick="javascript:hello()">........................</button> </body> </html>
6.css文件:
*{ font-family:黑体; font-size:1.656mm; } .blue{ color:#0000a6a6; } .yellow{ color:#a6a600; } .title{ margin:0; font-size:5mm; background:none; } .tip{ margin:0; background:none; } .start{ background-image:url("bg.jpg"); width:66px; height:24px; } .header{ font-style:run; } .notext{ font-size:0mm; }
bg.jpg文件: