写一个可以选择不同角色登录的html5页面
时间: 2023-11-22 18:54:04 浏览: 22
以下是一个简单的示例,可以让用户在登录页面上选择不同的角色:
```html
<!DOCTYPE html>
<html>
<head>
<title>Login Page</title>
</head>
<body>
<h1>Welcome to the Login Page</h1>
<form>
<label for="username">Username:</label>
<input type="text" id="username" name="username"><br><br>
<label for="password">Password:</label>
<input type="password" id="password" name="password"><br><br>
<label for="role">Select Role:</label>
<select id="role" name="role">
<option value="admin">Admin</option>
<option value="user">User</option>
<option value="guest">Guest</option>
</select><br><br>
<input type="submit" value="Login">
</form>
</body>
</html>
```
在这个示例中,我们使用了一个简单的HTML表单,其中包含三个输入字段:用户名,密码和角色。角色使用下拉列表实现,用户可以从中选择一个选项。
一旦用户提交表单,你就可以在后端代码中使用所选角色执行相应的操作,例如,如果用户选择“admin”角色,则可能会进入管理员仪表板,而如果选择“guest”角色,则可能只能查看某些内容而不能进行任何更改。