基于web的 汽车租赁系统登录页面代码
时间: 2023-10-24 21:09:01 浏览: 27
这里是一个简单的汽车租赁系统登录页面的示例代码,使用 HTML 和 CSS 实现:
HTML 代码:
```
<!DOCTYPE html>
<html>
<head>
<title>汽车租赁系统登录</title>
<meta charset="utf-8">
<link rel="stylesheet" type="text/css" href="login.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" id="password" name="password" required>
<button type="submit">登录</button>
</form>
</div>
</body>
</html>
```
CSS 代码:
```
body {
font-family: Arial, sans-serif;
background-color: #f1f1f1;
}
.container {
background-color: #fff;
padding: 20px;
margin: auto;
margin-top: 100px;
max-width: 500px;
box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.3);
}
h1 {
text-align: center;
color: #333;
}
form {
display: flex;
flex-direction: column;
}
label {
margin-top: 10px;
margin-bottom: 5px;
color: #666;
}
input[type=text], input[type=password] {
padding: 10px;
border: none;
border-radius: 5px;
background-color: #f1f1f1;
}
button[type=submit] {
padding: 10px;
margin-top: 20px;
border: none;
border-radius: 5px;
background-color: #333;
color: #fff;
font-weight: bold;
cursor: pointer;
}
button[type=submit]:hover {
background-color: #555;
}
```
这只是一个简单的示例,你可以根据自己的需求进行修改和优化。