xadmin 登录html
时间: 2023-08-02 17:29:33 浏览: 54
xadmin是一个基于Django的后台管理系统框架,提供了丰富的组件和插件,可以快速构建强大的后台管理系统。
xadmin的登录页面HTML代码如下:
```html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
<title>登录 - Xadmin</title>
<link rel="stylesheet" href="{% static 'xadmin/vendor/bootstrap/css/bootstrap.min.css' %}" />
<link rel="stylesheet" href="{% static 'xadmin/vendor/font-awesome/css/font-awesome.min.css' %}" />
<link rel="stylesheet" href="{% static 'xadmin/css/xadmin.min.css' %}" />
{% block extra_css %}{% endblock %}
</head>
<body class="login-bg">
<div class="login">
<div class="message">{{ site_title }} - 登录</div>
<div id="darkbannerwrap"></div>
<form method="post" class="layui-form">
{% csrf_token %}
<input name="csrfmiddlewaretoken" value="{{ csrf_token }}" type="hidden" />
<input name="next" value="{{ next }}" type="hidden" />
<div class="layui-form-item">
<label class="layui-form-label">用户名</label>
<div class="layui-input-block">
<input name="username" lay-verify="required" placeholder="请输入用户名" autocomplete="off" class="layui-input" type="text" />
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">密码</label>
<div class="layui-input-block">
<input name="password" lay-verify="required" placeholder="请输入密码" autocomplete="off" class="layui-input" type="password" />
</div>
</div>
{% if site_config.show_captcha %}
<div class="layui-form-item">
<label class="layui-form-label">验证码</label>
<div class="layui-input-block">
<div class="layui-row">
<div class="layui-col-md8">
<input name="captcha_0" lay-verify="required" placeholder="请输入验证码" autocomplete="off" class="layui-input" type="text" />
</div>
<div class="layui-col-md4">
<img src="{% url 'xadmin:captcha' %}?_={{ captcha_challenge }}" onclick="this.src='{% url 'xadmin:captcha' %}?_=' + Math.random()" />
</div>
</div>
</div>
</div>
{% endif %}
<div class="layui-form-item">
<button class="layui-btn layui-btn-fluid" lay-submit="" lay-filter="login">登录</button>
</div>
</form>
</div>
<script src="{% static 'xadmin/vendor/jquery/jquery.min.js' %}"></script>
<script src="{% static 'xadmin/vendor/bootstrap/js/bootstrap.min.js' %}"></script>
<script src="{% static 'xadmin/js/xadmin.min.js' %}"></script>
{% block extra_js %}{% endblock %}
</body>
</html>
```
这段代码包括一个登录表单,用户需要输入用户名和密码来登录xadmin后台管理系统。在表单提交之前,系统还会进行CSRF验证和验证码验证(如果开启了验证码功能)。如果验证通过,系统会将用户重定向到后台管理首页。
总的来说,xadmin的登录页面HTML代码简洁明了,易于理解和修改,可以根据具体需求进行定制。
相关推荐
![html](https://img-home.csdnimg.cn/images/20210720083451.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![zip](https://img-home.csdnimg.cn/images/20210720083736.png)
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)