首页形成一个简洁的登陆页面，css美观，主以白色为主背景颜色

形成一个简洁的登陆页面，css美观，主以白色为主背景颜色

时间: 2023-05-20 09:03:47 浏览: 70

可以使用以下代码实现一个简洁美观的登陆页面： ``` <!DOCTYPE html> <html> <head> <title>Login Page</title> <style> body { background-color: #f2f2f2; font-family: Arial, sans-serif; } form { background-color: #fff; border-radius: 5px; box-shadow: 0px 0px 10px #ccc; padding: 20px; width: 300px; margin: 50px auto; } input[type="text"], input[type="password"] { border: none; border-radius: 3px; box-shadow: 0px 0px 5px #ccc; display: block; margin: 10px 0; padding: 10px; width: 100%; } input[type="submit"] { background-color: #4CAF50; border: none; border-radius: 3px; color: #fff; cursor: pointer; display: block; font-size: 16px; margin: 10px 0; padding: 10px; width: 100%; } input[type="submit"]:hover { background-color: #3e8e41; } </style> </head> <body> <form> <h2>Login</h2> <input type="text" placeholder="Username"> <input type="password" placeholder="Password"> <input type="submit" value="Login"> </form> </body> </html> ``` 这段代码使用了简单的 CSS 样式来实现一个美观的登陆页面，主要以白色为主背景颜色。其中，`form` 元素用于包裹登陆表单，`input` 元素用于输入用户名和密码，`input[type="submit"]` 元素用于提交表单。