[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.

image.png

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.

image.png

That's all for today. Thank you very much.

Recommended Posts

[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 0-
[Beginner] [Python / Django] A fledgling web engineer tried a Django tutorial-Part 5-
[Beginner] [Python / Django] A fledgling web engineer tried a Django tutorial-Part 6-
[Beginner] [Python / Django] A fledgling web engineer tried a Django tutorial-Part 4-
[Beginner] [Python / Django] A fledgling web engineer tried a Django tutorial-Part 3-
Deploy a Python 3.6 / Django / Postgres web app on Azure
CTF beginner tried to build a problem server (web) [Problem]
Web scraping beginner with python
[Django3] Display a web page in Django3 + WSL + Python virtual environment
A liberal arts engineer tried knocking 100 language processes in Python 02
A python beginner tried to intern at an IT company
A liberal arts engineer tried knocking 100 language processes in Python 01
A liberal arts engineer tried knocking 100 language processes in Python 00
If you know Python, you can make a web application with Django
I tried web scraping with python.
Build a web application with Django
Python beginner tried 100 language processing knock 2015 (05 ~ 09)
web coder tried excel in Python
When a Python beginner tried using Bottle, it worked unexpectedly easily.
Python beginner tried 100 language processing knock 2015 (00 ~ 04)
A beginner of machine learning tried to predict Arima Kinen with python
An introduction to self-made Python web applications for a sluggish third-year web engineer
[Beginner] Python web scraping using Google Colaboratory
I have a question! (Python, django) Easy
Daemonize a Python web app with Supervisor
I tried a functional language with Python
[Python] A quick web application with Bottle!
I tried to make a Web API
Use Django from a local Python script
Run a Python web application with Docker
Let's make a web framework with Python! (1)
I tried benchmarking a web application framework
Let's make a web framework with Python! (2)
I made a WEB application with Django
A python beginner tried to intern at an IT company [Day 2 chatbot survey]
A python beginner tried to intern at an IT company [Day 1 development process]
Go beginner tried to create a cloud native web application using Datastore / GAE
I searched for the skills needed to become a web engineer in Python
Machine learning memo of a fledgling engineer Part 1
2-2. Input for becoming a WEB engineer (Linux basics)
How to open a web browser from python
I tried web scraping using python and selenium
Python web framework Django vs Pyramid vs Flask December 2015
I tried playing a typing game in Python
Start a simple Python web server with Docker
[Python] Build a Django development environment with Docker
[Python] Draw a Mickey Mouse with Turtle [Beginner]
Create a web map using Python and GDAL
Steps to develop a web application in Python
[Python] Web development preparation (building a virtual environment)
I tried reading a CSV file using Python
Programming beginner Python3 engineer certification basic exam record
Launch a web server with Python and Flask
Machine learning memo of a fledgling engineer Part 2
Run a Python file from html using Django
I tried adding a Python3 module in C
A simple to-do list created with Python + Django
I tried running alembic, a Python migration tool
Quickly build a Python Django environment with IntelliJ