[Anfänger] [Python / Django] Ein junger Webingenieur hat ein Django-Tutorial ausprobiert - Teil 6-

Einführung

Schön euch kennenzulernen, alle zusammen. Ich werde den Prozess der Erstellung eines Abstimmungsantrags mit Django als Memorandum veröffentlichen. Da ich ein Anfänger von Qiita bin, verstehen Sie bitte, dass es schwierig sein kann, es zu lesen.

Serie

• [[Anfänger] [Python / Django] Ein junger Webingenieur hat ein Django-Tutorial Nr. 0-] ausprobiert (https://qiita.com/oboerarenai_user/items/4ff87b2afbad8c16ad40).
• [Anfänger] [Python / Django] Ein junger Webingenieur hat ein Django-Tutorial ausprobiert - Teil 1-
• [[Anfänger] [Python / Django] Ein junger Webingenieur hat das Django-Tutorial-Teil 2-] ausprobiert (https://qiita.com/oboerarenai_user/items/4a36c2b11e7dee74b66b).
• [[Anfänger] [Python / Django] Ein junger Webingenieur hat das Django-Tutorial-Teil 3-] ausprobiert (https://qiita.com/oboerarenai_user/items/db5ef43bcff25223a147)
• [[Anfänger] [Python / Django] Ein junger Webingenieur hat das Django-Tutorial-Teil 4-] ausprobiert (https://qiita.com/oboerarenai_user/items/b942c865e38a46d112c6)

Fang an zu arbeiten

Dieses Mal werden wir mit statischen Dateien arbeiten. Statische Dateien sind JavaScript, CSS, Bilder usw.

Passen Sie die Struktur Ihrer App an

Erstellen Sie eine SCC-Datei. Erstellen Sie zunächst ein Verzeichnis zum Speichern der CSS-Datei.

Erstellen Sie ein Verzeichnis "polls / static / polls /" gemäß den Standardspezifikationen von Django. Lassen Sie uns eine style.css-Datei darunter erstellen.

Schreiben Sie CSS.

polls/static/polls/style.css

li a {
    color: red;
}

Laden Sie CSS in HTML. Vergessen Sie nicht, zu diesem Zeitpunkt das Vorlagen-Tag {% static%} zu verwenden.

polls/templates/index.html

{% load static %}

<link rel="stylesheet" type="text/css" href="{% static 'polls/style.css' %}">

Starten Sie den Server und überprüfen Sie, ob SCC angewendet wird.

(poll-HcNSSqhc) C:\django\poll>python manage.py runserver

Der Link ist jetzt rot.

Lassen Sie es in einem natürlicheren Grün.

polls/static/polls/style.css

li a {
    color: green;
}

Hintergrundbild hinzufügen

Erstellen Sie einen Bildordner. Bilder sind auch eine Art statische Datei. Erstellen Sie daher einen Ordner "polls / static / polls / images" und platzieren Sie das Django-Logo darunter.

polls/static/polls/style.css

body {
    background-image: url("images/django.png ");
    background-size: 30%;
    background-repeat: no-repeat;
}

Das Hintergrundbild wird angezeigt. Nachdem das Bild gelesen wurde, ist es vorerst in Ordnung.

Das ist alles für heute. Vielen Dank.