超实用！简单好看的登录界面HTML与CSS代码示例

以下是一个简单的登录界面的HTML和CSS代码示例： HTML： ```html <! html> <html> <head> <title>登录界面</title> <link rel="stylesheet" type="text" href="style.css"> </head<body> <div class="container"> <h1>登录</h1> <form> <label for="username用户名：</label> input type="text" id="username" name="username" required> <> <label for="password">密码：</label <input type="password" idpassword" name="password required> <br> <input type="submit" value登录"> </form </div> </body> </html> ``` CSS代码（保存为.css）： ```css .container { width: 300px; margin: 0 auto; padding: 20px; background-color: #f2f2f2; border: 1px solid #ccc; border-radius: 5px; } h1 { text-align: center; } label { display block; margin-top: 10px; } input[type=""], input[type="password { width: 100%; padding: 5px; border-radius: 5px; border: 1px solid #ccc; } input[typesubmit"] { width: 100%; padding: 10px; background-color:4CAF50; color: white; border: none; border-radius: 5px; cursor: pointer} input[type="submit"]:hover { background-color: #45049; } ``` 该代码创建了一个简的登录界面，包含用户名和密码输入框，以登录按钮。界面用了简单的样式设计，通过CSS进行了布和样式设置。你可以根自己的需求进行进一步的修改和美化。 ######[AI写代码神器 | 1174点数解答 | 2023-12-10 12:35:54]

服务商

更多选项

快捷项

自定义