Google App Engine：如何在模板中使用内部 CSS？

【问题标题】：Google App Engine: how to use the internal CSS in the template?Google App Engine：如何在模板中使用内部 CSS？
【发布时间】：2012-12-02 05:35:24
【问题描述】：

GAE 提供了一个模板系统，我们可以创建一个“base.html”，其中可以链接一个外部 CSS 文件（例如，“base.css”）。但是，如何在扩展的 html 中定义一些内部 CSS？我不想在“base.css”中定义 CSS，因为有太多扩展的 html 文件，它们可能会相互冲突。现在，我必须在标签内进行：-(

具体来说：

扩展的.html：

{% extends "base.html" %}
  <style>   <!-- how to do this? -->
    h1 {
      font-family: Arial;
      color: olive;
    }
    h2 {
      color: red;
    }
  </style>
  <h1> ... </h1>
    ...
  <h2> ... </h2>
    ...
  <h1> ... </h1>

【问题讨论】：

标签： css google-app-engine templates

【解决方案1】：

在你的 base.html 中定义一个块。块是可以从扩展模板中填充的占位符

方法1：

base.html

<style>
{% block css %}{% endblock %}
</style>

扩展的.html

{% block css %}
  h2 {
  color: red;
}
{% block %}

方法二：

base.html

<head>
<link href="base.css" rel="stylesheet">
{% block css %}{% endblock %}
</head>

扩展的.html

{% block css %}
 <link href="extended.css" rel="stylesheet">
{% block %}

【讨论】：