首页用html实现校园网站登录界面要有找回用户名找回密码记住密码等功能

用html实现校园网站登录界面要有找回用户名找回密码记住密码等功能

时间: 2024-03-17 10:44:11 浏览: 9

以下是一个带有找回用户名、找回密码和记住密码功能的校园网站登录界面的HTML代码： ```html <!DOCTYPE html> <html> <head> <title>校园网站登录</title> <link rel="stylesheet" type="text/css" href="style.css"> </head> <body> <div class="login-box"> <h2>校园网站登录</h2> <form> <div class="user-box"> <input type="text" name="username" required=""> <label>用户名</label> </div> <div class="user-box"> <input type="password" name="password" required=""> <label>密码</label> </div> <div class="forgot-password"> <a href="#">找回密码</a> </div> <div class="remember-me"> <input type="checkbox" name="remember" id="remember"> <label for="remember">记住我</label> </div> <input type="submit" name="" value="登录"> <div class="forgot-username"> <a href="#">找回用户名</a> </div> </form> </div> </body> </html> ``` 在上面的代码中，我们添加了一个类名为 `forgot-password` 的 `div` 元素来显示“找回密码”链接，并添加了一个类名为 `remember-me` 的 `div` 元素来显示“记住我”复选框。我们还添加了一个类名为 `forgot-username` 的 `div` 元素来显示“找回用户名”链接。你可以在CSS中对这些元素进行样式设置。