Html Question posted in
Some basic documentation can be found here.

Html – How to add css and bootstrap in python django

When I try to load css file along with bootstrap, my css file doesn’t work but bootstrap works fine. I don’t know what went wrong and it annoys me the fact that something that supposed to take minutes to work takes me days to make it work for me

enter image description here

<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Bootstrap demo</title>
    <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH" crossorigin="anonymous">
    <link rel="stylesheet" href="https://unpkg.com/[email protected]/dist/css/bootstrap.min.css">
    <link rel="stylesheet" href="https://unpkg.com/[email protected]/tutorials/buttons/button-1/assets/css/button-1.css">
    <link rel = "stylesheet" href = "css/style.css">
  </head>
  <body>
      {% block content %}
      {% endblock %}
    </div>
    <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz" crossorigin="anonymous"></script>
  </body>
</html>
Tags:

3

Answers


  1. Chosen as BEST ANSWER
    0

    I found the solution

    <link rel = "stylesheet" href = "static/css/style.css">

  2. 0

    I set up a basic example with this HTML in one folder, and a minimal style.css file in a css folder at the same level. Ultimately, I had to change the href for your stylesheet as follows

    <link rel="stylesheet" href = "../css/style.css">

    The trick was to change href to a relative path using ../

    Login or Signup to reply.
  3. 0

    Like static images I would serve a custom css-file as static Django file in the static directory of the corresponding Django app and include it within the template using the static tag.
    This will probably also make things easier if you want to go live later on.

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search