python - 如何根据某些条件更改 jinja2 条目的颜色？ (使用 flask )

Question

我刚刚完成了 flask tutorial ，一步一步创建一个博客网络应用程序。条目通过 jinja 模板呈现:

<ul class=entries>
    {% for entry in entries %}
        <li><h2>{{ entry.title }}</h2>{{ entry.text|safe }}
    {% else %}
        <li><em>Unbelievable.  No entries here so far</em>
    {% endfor %}
  </ul>

颜色在 style.css 中定义:

a, h1, h2       { color: #377ba8; }

但是，我真的希望能够根据条件切换条目的颜色。例如，如果 entry.text 是 'apples'，它应该是红色的，否则是绿色的。

作为 Web 开发的血腥菜鸟，我觉得这样的东西可能是 javascript，但我根本不知道如何完成这项任务，希望您的帮助。

最好的，

棕色

Answer 1

首先，您应该在您的 CSS 中添加一个规则，以便您可以通过将一个类应用到您的元素来更改颜色。像这样:

.apples {
    color: red;
}

然后，您需要让您的 Jinja 模板根据 entry.text 的值应用一个 class 属性:

<ul class="entries">
    {% for entry in entries %}
        <li {% if entry.text == 'apples' %} class="apples" {% endif %}>
            <h2>{{ entry.title }}</h2>
            {{ entry.text|safe }}
        </li>
    {% else %}
        <li>
            <em>Unbelievable. No entries here so far.</em>
        </li>
    {% endfor %}
</ul>

此技术在 Jinja 手册中有描述，例如在主题 “Highlighting Active Menu Items” 下.