Menu
CoddyTech

Pliki statyczne

Część sekcji Podstawy Django ścieżki Django w Coddy. Lekcja 20 z 23.

Strony kawiarni są czarne na białym tle. Arkusz stylów by to zmienił, a arkusze stylów, skrypty i obrazy to pliki statyczne: serwer wysyła je w niezmienionej postaci, bez widoku. Django znajduje je tak samo jak szablony — w folderze static/ każdej zainstalowanej aplikacji, z nazwą aplikacji wewnątrz:

shop/static/shop/cart.js

Są dostępne pod adresem STATIC_URL, czyli "static/" w pliku settings.py, więc ten plik znajduje się pod adresem /static/shop/cart.js. Szablon tworzy adres za pomocą {% static %}, po {% load static %}:

{% load static %}
<script src="{% static 'shop/cart.js' %}"></script>

Znacznik <link rel="stylesheet" href="..."> arkusza stylów umieść w <head>. Umieść go w base.html, a pojawi się na każdej stronie, która rozszerza ten szablon.

challenge icon

Wyzwanie

Łatwy
  • Utwórz plik menu/static/menu/style.css zawierający co najmniej body { background: #fdf8f2; }.
  • W pliku base.html załaduj tagi plików statycznych i umieść odnośnik do arkusza stylów w sekcji <head>, aby każda strona zawierała odnośnik do /static/menu/style.css.

Naciśnij Uruchom: strony przybierają kremowy kolor. Otwórz /static/menu/style.css, aby zobaczyć plik udostępniany przez Django.

Spróbuj swoich sił

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>{% block title %}Corner Café{% endblock %}</title>
</head>
<body>
    <nav>
        <a href="{% url 'menu:home' %}">Home</a>
        <a href="{% url 'menu:drinks' %}">Drinks</a>
        <a href="{% url 'menu:about' %}">About</a>
    </nav>
    <main>
        {% block content %}{% endblock %}
    </main>
</body>
</html>
quiz iconSprawdź się

Ta lekcja zawiera krótki quiz. Zacznij lekcję, żeby na niego odpowiedzieć i śledzić swoje postępy.

Wszystkie lekcje w sekcji Podstawy Django

Poćwicz samodzielnie: Edytor online Django