开始Flask项目

  1. 新建Flask项目。
  2. 设置调试模式。
  3. 理解Flask项目主程序。
  4. 使用装饰器，设置路径与函数之间的关系。
  5. 使用Flask中render_template，用不同的路径，返回首页、登录员、注册页。
  6. 用视图函数反转得到URL，{{url_for(‘login’)}}，完成导航条里的链接。　　 
    from flask import Flask,render_template

app = Flask(__name__)


@app.route('/')
def index():
    return render_template('index.html')
@app.route('/login/')
def login():
    return render_template('login.html')
@app.route('/register/')
def register():
    return render_template('register.html')

if __name__ == '__main__':
    app.run(debug=True)
    <!DOCTYPE html>
<html lang="en">
<head>
     <body background="https://ss1.bdstatic.com/70cFuXSh_Q1YnxGkpoWK1HF6hhy/it/u=211731831,2598914702&fm=27&gp=0.jpg"></body>
    <title>哔哩哔哩 (゜-゜)つロ 干杯~-bilibili</title>
    <link rel="stylesheet"type="text/css"href="">
    <style type="text/css">
p {     color: red;
 }
        .textblue{
            color: orange;
        }
        #a{
            color: blue;
        }

#tt{
color:#FFD700;
}
.x1{
    color: red;
}

</style>
</head>
<body>

<nav>
    <img class="c-img c-img6" src="https://ss1.baidu.com/6ONXsjip0QIZ8tyhnq/it/u=2810627290,1080409091&amp;fm=58&amp;s=8197C732C535FA313E526557030030BB&amp;bpow=121&amp;bpoh=75" style="height:75px;"width=200><br>



    <input type="text"name="search">
    <button type="submit">搜索</button>
    <a href="{{ url_for('index') }}">首页</a>
    <a href="{{ url_for('login') }}">登录</a>
    <a href="{{ url_for('register') }}">注册</a>

</nav>
<h1><span style="background-color:yellow;font-size: larger"; fon>blibli欢迎您</h1>
<p></p>
<div  id="container" style="width:400px " >


<hr>
<p><span style="background-color: gold;font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;font-size: 50px">哔哩哔哩 (゜-゜)つロ 干杯~-bilibili</span></p>
</body>

</body>
</html>
    <!DOCTYPE html>
<html lang="en">
<head>
     <body background="https://ss1.bdstatic.com/70cFuXSh_Q1YnxGkpoWK1HF6hhy/it/u=211731831,2598914702&fm=27&gp=0.jpg"></body>
    <meta charset="UTF-8">
    <title>登录</title>
    <link rel="stylesheet"type="text/css"href="../static/css/emm.css">
    <script src="../static/js/ojbk.js"></script>

</head>
<body>

<div class="aa" >
    <div class="login" ><h2>LOGIN</h2></div>
    <div class="aa1" >
        Username：<input id="name" type="text"placeholder="请输入用户名"><br>
        Password：<input id="password" type="password"placeholder="请输入密码"><br>
        </div>
        <div id="error_box"><br></div>
      <div class="aa2" >
         <button onclick="myLogin()">Login</button>
         <button type="button" onclick=window.alert("是否取消登录！")>Cancel</button>


    </div>
</body>
</html>
    <!DOCTYPE html>
<html lang="en">
<head>
    <body background="https://ss1.bdstatic.com/70cFuXSh_Q1YnxGkpoWK1HF6hhy/it/u=211731831,2598914702&fm=27&gp=0.jpg"></body>
    <meta charset="UTF-8">
    <title>注册</title>
    <link rel="stylesheet"type="text/css"href="../static/css/emm1.css">
    <script src="../static/js/ojbk1.js"></script>

</head>
<body>

<div class="aa" >
    <div class="login" ><h2>注册/Register</h2></div>
    <div class="aa1" >
        Set account：<input id="name" type="text"placeholder="请输入用户名"><br>
        Set password：<input id="password" type="password"placeholder="请输入密码"><br>
        Repeat password：<input id="password1" type="password"placeholder="请再次输入密码"><br>
        Phone number：<input id="userphone" type="text"placeholder="请输入手机号码"><br>
    </div>
        <div id="error_box"><br></div>
      <div class="aa2" >
         <button onclick="myLogin()">Submit</button>
         <button type="button" onclick=window.alert("是否取消登录！")>Cancel</button>


    </div>
</body>
</html>

posted @ 2017-11-03 20:26  060王昊  阅读(179)  评论(0)  编辑  收藏  举报