时间戳

首页 > 解决方案 > bootstrap 4 css 不适用于烧瓶中的邮件 html 模板

html - bootstrap 4 css 不适用于烧瓶中的邮件 html 模板

问题描述

所以我有这个 html 模板，我用它作为邮件模板来发送我的用户以重置他们的密码。我想bootstrap 4 classes在模板中使用，但它不起作用。我如何使这项工作？我试过inline css了，效果很好，但我想使用bootstrap 4 css. 任何帮助，将不胜感激。

HTML 模板

<!DOCTYPE html>
<html lang="en" dir="ltr">

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>{{title}}</title>
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css">
    <link href="https://fonts.googleapis.com/css2?family=Poppins&family=Rubik:wght@300&display=swap" rel="stylesheet">
</head>

<body>


    <div class="container">
        <div class="text-center">
            <h2>Have you just requested for the password reset !</h2>
            <a href="#" class="btn btn-outline-success">Reset Password</a>
        </div>
    </div>

    <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js" charset="utf-8"></script>
    <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.bundle.min.js" charset="utf-8"></script>
</body>

</html>

烧瓶代码

@app.route('/forget', methods=['GET', 'POST'])
def forget_password():
    form = ForgetPassword()
    if request.method == 'GET':
        return render_template("forget.html", title="Forget Password", form=form)
    email = request.form['email']
    session['email'] = email
    token = s.dumps(email, salt='reset-password')
    msg = Message("Password Reset", sender="bookverm1999@gmail.com", recipients=[email])
    link = url_for("reset_pass", token=token, _external=True)
    msg.body = "Password Reset Link"
    msg.html = render_template("mail.html", link=link, title="Password Reset")
    mail.send(msg)
    return render_template("sent.html", title="Email Sent")

标签： htmlcssflask

解决方案

您只能使用内联 css，电子邮件不支持 css 链接，它仅受浏览器支持。我已经尝试使用我前一段时间创建的旧 css 来做到这一点，但我不得不将它嵌入到 html 中。

推荐阅读