如何根据某些条件更改 jinja2 条目的颜色？ （使用烧瓶）

我刚刚完成了烧瓶教程 http://flask.pocoo.org/docs/0.12/tutorial/，逐步创建博客 Web 应用程序。这些条目通过 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”，则它应该为红色，否则为绿色。

作为网络开发的菜鸟，我觉得这样的东西可能是 javascript，但我根本不知道如何完成这项任务，非常感谢您的帮助。

Best,

gbrown

首先，您应该向 CSS 添加一条规则，以便可以通过向元素应用类来更改颜色。像这样的事情：

.apples {
    color: red;
}

然后，您需要使您的 Jinja 模板应用class属性取决于 的值entry.text:

<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 手册中描述了此技术，例如在主题下“突出显示活动菜单项” http://jinja.pocoo.org/docs/2.10/tricks/#highlighting-active-menu-items.