[Beginner] [Python / Django] A fledgling web engineer tried a Django tutorial-Part 6-
Introduction
Nice to meet you, everyone. I'm going to publish a memorandum of the process of creating a voting (poll) application using Django. Since I am a beginner of Qiita, please understand that some parts may be difficult to read.
series
-[Beginner] [Python / Django] A fledgling web engineer tried a Django tutorial-No. 0- -[Beginner] [Python / Django] A fledgling web engineer tried a Django tutorial-Part 1- -[Beginner] [Python / Django] A fledgling web engineer tried a Django tutorial-Part 2- -[Beginner] [Python / Django] A fledgling web engineer tried a Django tutorial-Part 3- -[Beginner] [Python / Django] A fledgling web engineer tried a Django tutorial-Part 4-
Start work
This time we will work with static files. Static files are JavaScript, CSS, images, etc.
Customize the structure of your app
Create an SCC file. First, create a directory to store the CSS file.
Create a "polls / static / polls /" directory according to Django's default specifications. Let's create a style.css file under it.
Write CSS.
polls/static/polls/style.css
li a {
color: red;
}
Load CSS into HTML. Don't forget to use the {% static%} template tag at this time.
polls/templates/index.html
{% load static %}
<link rel="stylesheet" type="text/css" href="{% static 'polls/style.css' %}">
Start the server and verify that SCC is applied.
(poll-HcNSSqhc) C:\django\poll>python manage.py runserver
The link is now red.
Leave it in a more natural green.
polls/static/polls/style.css
li a {
color: green;
}
Add background image
Create an image folder. Images are also a type of static file, so create a "polls / static / polls / images" folder and place the Django logo under it.
polls/static/polls/style.css
body {
background-image: url("images/django.png ");
background-size: 30%;
background-repeat: no-repeat;
}
The background image is displayed. Now that the image has been read, it's OK for the time being.
That's all for today. Thank you very much.
Recommended Posts