Difference between revisions of "Using CSS files"
From MyWiki
| (4 intermediate revisions by the same user not shown) | |||
| Line 1: | Line 1: | ||
In the "hello" folder create a folder called "static" and within it create a folder called "hello"<br> | In the "hello" folder create a folder called "static" and within it create a folder called "hello"<br> | ||
In this "hello" folder create a file called "styles.css" with the following contents:<br> | In this "hello" folder create a file called "styles.css" with the following contents:<br> | ||
| + | <source lang="html4strict"> | ||
| + | h1{ | ||
| + | font-family: sans-serif; | ||
| + | font-size: 90px; | ||
| + | text-align: center; | ||
| + | color: green; | ||
| + | } | ||
| + | |||
| + | </source> | ||
| + | Then make the greet.html file look like below:<br> | ||
| + | <source lang=html4strict> | ||
| + | {% load static %} | ||
| + | <!DOCTYPE html> | ||
| + | <html lang="en"> | ||
| + | <head> | ||
| + | <title> Hello</title> | ||
| + | <link href="{% static 'hello/styles.css' %}" rel="stylesheet"> | ||
| + | </head> | ||
| + | |||
| + | <body> | ||
| + | <h1> Hello, {{ name }}!</h1> | ||
| + | </body> | ||
| + | </html> | ||
| + | </source> | ||
Latest revision as of 17:22, 19 March 2021
In the "hello" folder create a folder called "static" and within it create a folder called "hello"
In this "hello" folder create a file called "styles.css" with the following contents:
h1{
font-family: sans-serif;
font-size: 90px;
text-align: center;
color: green;
}Then make the greet.html file look like below:
{% load static %}
<!DOCTYPE html>
<html lang="en">
<head>
<title> Hello</title>
<link href="{% static 'hello/styles.css' %}" rel="stylesheet">
</head>
<body>
<h1> Hello, {{ name }}!</h1>
</body>
</html>