Flask 论坛开发（三）

最新推荐文章于 2024-04-10 15:09:45 发布

hzh7468

最新推荐文章于 2024-04-10 15:09:45 发布

阅读量182

点赞数 1

分类专栏： Flask 论坛开发文章标签： flask python

本文链接：https://blog.csdn.net/hzh7468/article/details/119734444

版权

本期目标：模板创建1、模板1.1 CMS后台登录界面templates\cms\cms_login.html<!DOCTYPE html><html><head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=devi

摘要由CSDN通过智能技术生成

a本期目标：模板创建

1、安装wtforms

pip install wtforms

2、模板

templates\cms\cms_login.html

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial=1">
    <!-- 前面三个meta标签必须放在最前面！ -->

    <title>凤凰论坛 - CMS登录</title>

    <link href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
    <link href="{
  { url_for('static', filename='cms/css/signin.css') }}" rel="stylesheet">
</head>
<body>
<div class="top-pannel">
    <h2>凤凰论坛</h2>
    <br>
    <p>fhuang forum</p>
</div>
<div class="content">
    <form class="form-signin">
	<br><br><br><br><br><br><br><br><br><br><br>
        <h2 class="from-sign-heading">请登录：</h2>
        <label for="inputEmail" class="sr-only">邮箱：</label>
        <input type="email" id="inputEmail"class="form-control" placeholder="邮箱" required autofocus>
        <label for="inputPassword" class="sr-only">密码：</label>
        <input type="password" id="inputPassword" class="form-control" placeholder="密码" required>
        <div class="checkbox">
            <label>
                <input type="checkbox" value="remember-me">记住我
            </label>
        </div>
        <button class="btn btn-lg btn-primary btn-block" type="submit">立即登录</button>
    </form>
</div>
</body>
</html>

static\cms\css\signin.css

body {
    padding-top: 40px;
    padding-bottom: 40px;
    background-color: #eee;
}

.form-signin {
    max-width: 330px;
    padding: 15px;
    margin: 0 auto;
}
.form-signin .form-signin-heading,
.form-signin .checkbox {
    margin-bottom: 10px;
}
.form-signin .checkbox {
    font-weight: normal;
}
.form-signin .form-control {
    position: relative;
    height: auto;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding: 10px;
    font-size: 16px;
}
.form-signin .form-control:focus {
    z-index: 2;
}
.form-signin input[type="email"] {
    margin-bottom: -1px;
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
}
.form-signin input[type="password"] {
    margin-bottom: 10px;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}
.top-pannel {
    background-color: #444;
    height: 120px;
    width: 100%;
    text-align: center;
    border-radius: 8px;
    color: #eee;
    position: fixed;
    top: 0;
}
.content {
    top: 25%;
}

最低0.47元/天解锁文章

hzh7468

关注

1
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
Flask 论坛开发（三）

本期目标：模板创建1、模板1.1 CMS后台登录界面templates\cms\cms_login.html<!DOCTYPE html><html><head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=devi
复制链接

扫一扫