开始Flask项目
- 新建Flask項目。
- 設置調試模式。
- 理解Flask項目主程序。
- 使用裝飾器，設置路徑與函數之間的關系。
- 使用Flask中render_template，用不同的路徑，返回首頁、登錄員、注冊頁。
- 用視圖函數反轉得到URL，url_for(‘login’)，完成導航里的鏈接。
#encoding:utf8
from flask import * #從flask這個框架中導入Flask這個類
import config
app = Flask(__name__) #初始化一個Flask對象,需要傳遞一個參數__name__
app.config.from_object(config)
@app.route(‘/’) #是一個裝飾器,在函數上面, 其作用是做一個URL與視圖函數的映射,127.0.0.1:5000/ 去執行hello_world()函數
def hello_world():
return ‘Hello world!’
if __name__ == '__main__’: #當前這個文件作為主程序運行,就會執行這段,作為模塊就不會
app.run() #啟動一個web服務器，來監聽并接受用戶的請求。
untitled.py
1 from flask import Flask,render_template 2 3 app = Flask(__name__) 4 5 @app.route('/') 6 def base(): 7 return render_template('base.html') 8 9 @app.route('/login/') 10 def login(): 11 return render_template('login.html') 12 13 @app.route('/regist/') 14 def regist(): 15 return render_template('regist.html') 16 17 18 19 if __name__ == '__main__': 20 app.run(debug=True)
base.html
1 <html lang="en"> 2 <head> 3 <meta charset="UTF-8"> 4 <title>首頁</title> 5 <link type="text/css" rel="stylesheet" href="{{url_for('static',filename='css/login.css')}}"> 6 </head> 7 <body> 8 <img id="myOnOff" onclick="mySwitch()" 9 src="https://tva4.sinaimg.cn/crop.0.0.1242.1242.180/bde8475djw8f1hu7mrcy2j20yi0yiabl.jpg" width="30px"> 10 <a href="{{ url_for('base') }}">首頁</a> 11 <a href="{{ url_for('regist') }}">注冊</a> 12 <a href="{{ url_for('login') }}">登錄</a> 13 14 <img src="{{ url_for('static',filename='img/615a00260bb4117f98e0d128532ff959.jpg')}}" width="50px"> 15 16 </body> 17 </html>
login.css
1 *{ 2 margin: 3px; 3 padding: 3px; 4 font-family:"新宋體"; 5 font-size: 16px; 6 } 7 8 .box { 9 border: 1px solid #cccccc; 10 position: absolute; 11 top: 42%; 12 left: 50%; 13 height: 320px; 14 width: 390px; 15 background: #FFF; 16 margin-left: -195px; 17 margin-top: -160px; 18 } 19 20 h2 { 21 font-size: 16px; 22 text-align: center; 23 height: 46px; 24 font-weight:normal; 25 color:#666; 26 line-height: 46px; 27 backgroud:#f7f7f7; 28 overflow: hidden; 29 border-bottom:solid 1px #ddd; 30 } 31 .input_box { 32 width: 350px; 33 padding-bottom: 15px; 34 margin:0 auto; 35 overflow:hidden; 36 text-align: center; 37 } 38 39 input { 40 align-self: center; 41 height: 30px; 42 width: 280px; 43 44 } 45 46 button { 47 align-content: center; 48 font-family: 新宋體; 49 font-size: 28px; 50 text-align: center; 51 background: #cccccc; 52 height: 40px; 53 width: 300px; 54 }
?
轉載于:https://www.cnblogs.com/l-j-l/p/7780521.html
總結
- 上一篇： 性能测试之二——常用的性能测试策略
- 下一篇： history对象