首页用html,css,js写一个登陆页面

用html,css,js写一个登陆页面

时间: 2023-12-19 11:03:50 浏览: 76

好的，这是一个关于如何使用 HTML、CSS 和 JavaScript 创建一个登录页面的指导。 1. HTML：主要用于创建页面结构和内容，如标题、文本、输入字段、按钮等。 ```html <!DOCTYPE html> <html> <head> <title>登录页面</title> </head> <body> <h1>登录</h1> <form> <label for="username">用户名</label> <input type="text" id="username" name="username"> <br><br> <label for="password">密码</label> <input type="password" id="password" name="password"> <br><br> <button type="submit">登录</button> </form> </body> </html> ``` 2. CSS：用于设置页面样式，如字体、颜色、布局等。 ```css form { width: 300px; margin: 0 auto; } label { font-weight: bold; } ``` 3. JavaScript：用于添加交互效果，如验证输入、处理表单提交等。 ```javascript const form = document.querySelector('form'); form.addEventListener('submit', function (event) { event.preventDefault(); const username = document.querySelector('#username').value; const password = document.querySelector('#password').value; if (!username || !password) { alert('用户名和密码不能为空！'); } else { // 在这里发送登录请求 } }); ``` 这仅仅是一个简单的例子，实际应用中还需要考虑更多因素，如安全性、可用性等。

阅读全文