Введение
Этот туториал начинается там, где закончился **Создайте некоторые автоматические тесты**
. Мы создали веб-приложение для опросов с тестами, и теперь добавим в него таблицу стилей и изображение.
💡 Этот учебник переведен с английского с помощью ИИ. Чтобы просмотреть оригинал, вы можете перейти на английский оригинал
Этот туториал начинается там, где закончился **Создайте некоторые автоматические тесты**
. Мы создали веб-приложение для опросов с тестами, и теперь добавим в него таблицу стилей и изображение.
Сначала создайте директорию с именем static
в директории polls
. Django будет искать статические файлы в этой директории, аналогично тому, как Django находит шаблоны внутри polls/templates/
.
Настройка STATICFILES_FINDERS
в Django содержит список поисковиков, которые знают, как обнаруживать статические файлы из различных источников. Одним из стандартных является AppDirectoriesFinder
, который ищет поддиректорию "static" в каждой из INSTALLED_APPS
, как в polls
, которую мы только что создали. Административный сайт использует ту же структуру директорий для своих статических файлов.
Внутри директории static
, которую вы только что создали, создайте другую директорию с именем polls
, а внутри нее создайте файл с именем style.css
. Другими словами, ваш таблица стилей должна быть расположена по адресу polls/static/polls/style.css
. В силу того, как работает поисковик статических файлов AppDirectoriesFinder
, вы можете ссылаться на этот статический файл в Django как polls/style.css
, аналогично тому, как вы ссылаетесь на путь к шаблонам.
Похоже на шаблоны, мы возможно могли бы обойтись и без создания дополнительной поддиректории polls
внутри polls/static
и положить наши статические файлы прямо в polls/static
, но на самом деле это было бы плохой идеей. Django будет выбирать первый статический файл, имя которого совпадает, и если у вас был бы статический файл с таким же именем в другом приложении, Django не смог бы различить между ними. Мы должны уметь указывать Django на правильный файл, и лучший способ этого сделать - это именование с учетом пространства имен. То есть, поместить эти статические файлы внутри другой директории, названной по имени самого приложения.
Вставьте следующий код в этот таблицу стилей (polls/static/polls/style.css
):
li a {
color: green;
}
Далее, добавьте следующее в начало polls/templates/polls/index.html
:
{% load static %}
<link rel="stylesheet" href="{% static 'polls/style.css' %}">
Шаблонный тег {% static %}
генерирует абсолютный URL-адрес статических файлов.
Это все, что вам нужно сделать для разработки.
Запустите сервер (или перезапустите его, если он уже запущен):
python manage.py runserver 0.0.0.0:8080
Перезагрузите вкладку Web 8080 и вы должны увидеть, что ссылки на вопросы зеленые (в стиле Django!), что означает, что ваша таблица стилей была правильно загружена.
Далее, мы создадим поддиректорию для изображений. Создайте поддиректорию images
в директории polls/static/polls/
. Внутри этой директории добавьте любое изображение, которое вы хотите использовать в качестве фона. В целях этого туториала мы используем файл с именем background.png
, который можно найти в директории /tmp/background.png
в виртуальной машине.
Необходимо скопировать /tmp/background.png
в polls/static/polls/images/background.png
.
Затем добавьте ссылку на ваше изображение в таблицу стилей (polls/static/polls/style.css
):
body {
background: white url("images/background.png") no-repeat;
}
Перезагрузите вкладку Web 8080 и вы должны увидеть, что фон загружен в верхнем левом углу экрана.
Шаблонный тег
{% static %}
недоступен для использования в статических файлах, которые не генерируются Django, таких как ваша таблица стилей. Вы должны всегда использовать относительные пути для связывания между собой ваших статических файлов, потому что тогда вы можете изменитьSTATIC_URL
(используемый шаблонным тегомstatic
для генерации его URL-адресов) без необходимости также изменять кучу путей в ваших статических файлах.
Вот основы. Для получения более подробной информации о настройках и других аспектах, включенных в фреймворк, см. руководство по статическим файлам </howto/static-files/index>
и справочник по staticfiles </ref/contrib/staticfiles>
. Развертывание статических файлов </howto/static-files/deployment>
обсуждает, как использовать статические файлы на настоящем сервере.
Когда вы будете знакомы с статическими файлами, прочитайте раздел Настройка административного сайта Django, чтобы узнать, как настроить автоматически сгенерированный административный сайт Django.
Поздравляем! Вы завершили лабораторную работу "Добавление таблицы стилей и изображения". Вы можете практиковаться в других лабораторных работах в LabEx, чтобы улучшить свои навыки.