CSS 发生变化的时间与预期不同 URL

Question

我正在尝试创建一个网络应用程序，并且 localhost:8000 我想在主页上放置一个显示学校数据集的 table。问题是 css 样式不适用于 localhost:8000，但它们出现在 localhost:63342 上。

localhost:63342

样式修改可见（参见 GID 单元格）
数据库未加载

localhost:8000

样式看不到
数据库加载

我也希望能够在 localhost:8000 上看到样式修改

schooldetails.html:




<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <link rel="stylesheet" type="text/css" href="schooldetails.css">
    <meta name="viewport" content="width=device-width,initial-scale=1.0">
    <title>Document</title>
    <style>
        th,td{
        border: 1px black solid;
        }
    </style>
</head>
<body>
 <h1>School Page</h1>
{% if schools %}
<table>
     <tr id="school-gap ">
         <th class="cell">GID</th>
         <th>Type</th>
         <th>Province</th>
         <th>Street</th>
         <th>House_number</th>
         <th>Postcode</th>
         <th>City</th>
         <th>Municipality</th>
         <th>Geometry</th>
     </tr>
 <tr>

         {% for st in schools %}
         <td>{{st.gid}}</td>
         <td>{{st.schooltype}}</td>
         <td>{{st.provincie}}</td>
         <td>{{st.straatnaam}}</td>
         <td>{{st.huisnummer}}</td>
         <td>{{st.postcode}}</td>
         <td>{{st.plaatsnaam}}</td>
         <td>{{st.gemeentena}}</td>
         <td>{{st.geom}}</td>
 </tr>
          {% endfor %}
</table>
{% else %}
 <h1>No Data</h1>
{% endif %}
</body>
</html>

schooldetails.css

/* (A) CONTAINER */
#school-gap {
  /* (A1) GRID LAYOUT */
  display: grid;

  /* (A2) SPECIFY COLUMNS */
  grid-template-columns: auto auto auto;

  /* we can also specify exact pixels, percentage, repeat
  grid-template-columns: 50px 100px 150px;
  grid-template-columns: 25% 50% 25%;
  grid-template-columns: 100px 20% auto;
  grid-template-columns: repeat(3, auto); */
}

/* (B) GRID CELLS */
th.cell {
  background: #fff600;
  border: 1px solid #000;
  padding: 10px;
}

/* (C) RESPONSIVE - 1 COLUMN ON SMALL SCREENS */
@media screen and (max-width: 640px) {
  #grid-col { grid-template-columns: 100%; }
}

views.py:

from django.http import JsonResponse
from django.shortcuts import render
from rest_framework.response import Response
from rest_framework.parsers import JSONParser
from rest_framework.decorators import api_view
from base.models import RSchools as School
from definitions import ROOT_DIR
from .serializers import SchoolSerializer

@api_view(['GET'])
def get_data(request):
    schools = School.objects.all()
    return render(request, f'{ROOT_DIR}/templates/schooldetails.html', {'schools': schools})

Answer 1

在您的 settings.py 文件中，关闭允许的主机：

ALLOWED_HOSTS = ['localhost', 'localhost:8000']

Answer 2

问题是 pycharm 找不到 css 文件。我更改了以下内容并使其工作：

settings.py:

STATIC_URL = '/static/'
STATIC_ROOT = os.path.join(BASE_DIR, '/')
STATICFILES_DIRS = (
    os.path.join(BASE_DIR, "static"),
)

schooldetails.html:

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

CSS 发生变化的时间与预期不同 URL

CSS changes happen on diffrent URL than expected

python

html

css

django

web