Использование переменной Django в файле CSS - PullRequest
Новая
       12

Использование переменной Django в файле CSS

15 голосов
/ 19 мая 2011

Я пытаюсь создать динамический файл CSS, используя шаблонизатор Django или любым другим способом.

В настоящее время у меня есть правило CSS, которое выглядит следующим образом: 

background-image: url('http://static.example.com/example.png');

Где http://static.example.com соответствует переменной STATIC_URL в Python. Используя шаблонизатор Django, я теоретически мог бы написать что-то вроде этого: 

background-image: url('{{ STATIC_URL }}example.png');

Мой вопрос: как я могу использовать шаблонизатор Django (или любые другие средства) для динамического генерирования CSS?

Ответы [ 2 ]

12 голосов
/ 19 мая 2011

Очень хорошим решением здесь является использование django-compress .Во-первых, если вы обслуживаете более одного файла CSS, компрессор поможет сократить время загрузки страницы, уменьшив количество запросов.

Побочным эффектом сжатия / объединения файлов является то, что компрессор переписывает URL-адреса в файле css, поэтому относительные ссылки на статические файлы (например, ../img/logo.png) автоматически становятся полностью определенными URL-адресами со статическим файломurl (например, http://static.example.com/img/logo.png).

В качестве альтернативы вы можете написать пользовательские фильтры для достижения желаемого или сжать полностью статический CSS и некоторые динамические части в один файл (например, для этогов вашем базовом файле макета): 

{% compress css %}
   <link .... />
   <style>
       .some_rule {background-image:{{MEDIA_URL}}/img/logo.png}
   </style>
{% endcompress %}

Это также означает, что вам не нужно беспокоиться об эффективности, поскольку файлы css / js генерируются при первом доступе к шаблону, который их использует, и онихранятся как обычные файлы в вашем статическом каталоге (это настраивается), поэтому они обслуживаются как обычные статические файлы.

9 голосов
/ 19 мая 2011

У вас есть два варианта:

  1. Служите вашему CSS динамически, с записью в urls.py и т. Д., Как если бы это была страница HTML. Файл шаблона будет просто CSS вместо HTML, но будет использовать обычный синтаксис шаблона Django и т. Д.

  2. Ярлык: ссылка на фоновое изображение с относительным путем. Это может или не может быть возможным для вашей среды, но это удобный способ иметь статический CSS-файл, ссылающийся на разные пути в зависимости от того, где он находится.

...