首页制作一个带个性化背景的的html登陆界面代码

制作一个带个性化背景的的html登陆界面代码

时间: 2023-04-01 08:01:32 浏览: 102

你好，以下是一个带个性化背景的 HTML 登录界面代码： ```html <!DOCTYPE html> <html> <head> <title>登录</title> <style> body { background-image: url("background.jpg"); background-size: cover; background-position: center; font-family: Arial, sans-serif; } form { background-color: white; padding: 20px; border-radius: 10px; box-shadow: 10px rgba(, , , .3); width: 300px; margin: 100px auto; } input[type="text"], input[type="password"] { padding: 10px; margin-bottom: 20px; border-radius: 5px; border: none; box-shadow: 5px rgba(, , , .1); width: 100%; } input[type="submit"] { background-color: #4CAF50; color: white; padding: 10px; border: none; border-radius: 5px; cursor: pointer; width: 100%; } input[type="submit"]:hover { background-color: #3e8e41; } </style> </head> <body> <form> <h2>登录</h2> <label for="username">用户名</label> <input type="text" id="username" name="username" required> <label for="password">密码</label> <input type="password" id="password" name="password" required> <input type="submit" value="登录"> </form> </body> </html> ``` 希望对你有帮助！