Python,HTML,CSSの連携

散歩道に咲いた花

下記コーディングはQiitaの記事を参考にさせていただきました。
-Python(app.py)

#!/usr/bin/python3
# -*- coding: utf-8 -*-
# app.py

from flask import Flask, redirect ,request,render_template

app = Flask(__name__)

@app.route("/check")
def check():
    return render_template('check.html')

@app.route('/',methods=['POST'])
def index():
    my_age = int(request.form["age"])
    my_name = request.form["name"]
    return render_template('index.html',age=my_age,name=my_name)

if __name__ == '__main__':
    app.run(debug=True)

-HTML(check.html)

<!DOCTYPE html>
<html lang="ja">
<head>
    <meta charset="UTF-8">
    <title>年齢確認</title>
<!--    <link rel="stylesheet" type="text/css" href="{{url_for('static', filename='style.css')}}" />  -->
    <link rel="stylesheet" type="text/css" href="static/css/style.css" />
</head>
<body>

    <form action="/" method="post">
        <h1>年齢確認</h1>
        <input type="text" name="name" placeholder="名前" required/>
        <input type="number" name="age" placeholder="年齢" required/>
        <button>年齢確認</button>
    </form>

</body>
</html>

-HTML(index.html)

<!DOCTYPE html>  <!-- index.html -->
<html lang="ja">
    <head>
        <meta charset="UTF-8">
        <title>18禁のサイト</title>
<!--        <link rel="stylesheet" type="text/css" href="style.css" />  -->
	<link rel="stylesheet" type="text/css" href="static/css/style-04.css" />
        <!--[if lt IE 9]>
        <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
        <![endif]-->
    </head>
    <body>
    <h1>射幸心を煽りまくるホームページ</h1>
    {% if age >= 18 %}
    {{name}}さんは18歳以上ですね。
    {% else %}
    {{name}}さんみたいな方はこんなHP見ちゃいけません?
    {% endif %}

    </body>
</html>

-CSS(style.css)

@charset 'utf-8';
body	 {
	background: sandybrown;
	color: darkgreen;
	margin-left: 2m;
	margin-right: 2m;
}

-CSS(style-04.css)

@charset 'utf-8';
body	 {
	background: violet;
	color: darkgreen;
	margin-left: 2m;
	margin-right: 2m;
}

以上

↑人気ブログランキングに参加しています。ポチっと1票を!

投稿者: 管理者

大学の工学部電気工学科演算工学講座で学び卒業論文で「小型コンピューターのオペレーティングシステム(ジョブの連続処理)」を書いた。卒業してコンピューター会社に入社し以来コンピューター一筋SE、SAとして働いた。退職後趣味でWeb開発をしている。現在、AIに興味を持っている。

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です