用BOOTSTRAP样式布一个HTML登录页面,LOGO图片,有用户名,密码,记住我,要在一行显示。label用中文。
时间: 2023-05-23 11:01:53 浏览: 50
请看以下代码:
```
<!DOCTYPE html>
<html>
<head>
<title>Login Page</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
</head>
<body>
<div class="container">
<div class="row">
<div class="col-md-4 col-md-offset-4">
<div class="panel panel-default">
<div class="panel-heading">
<strong><img src="logo.png" alt="Logo"> 登录</strong>
</div>
<div class="panel-body">
<form role="form">
<div class="form-group">
<label for="username">用户名:</label>
<input type="text" class="form-control" id="username" name="username" placeholder="请输入用户名">
</div>
<div class="form-group">
<label for="password">密码:</label>
<input type="password" class="form-control" id="password" name="password" placeholder="请输入密码">
</div>
<div class="checkbox">
<label><input type="checkbox" name="remember"> 记住我</label>
</div>
<button type="submit" class="btn btn-default">登录</button>
</form>
</div>
</div>
</div>
</div>
</div>
</body>
</html>
```
请注意,其中的图片路径和相关资源需要你自己设定。也可以加入 JavaScript 等代码,使得登录更加实用化。