Блог

Главная - Вопросы по программированию - Внешний CSS не работает в HTML в проекте Python

Внешний CSS не работает в HTML в проекте Python

#python #html #css #django

#python #HTML #css #django

Вопрос:

Я заменил <style> тег на base.html внешний файл CSS. В base.html нем есть меню, которое ссылается на разные HTML-страницы. Когда я нажимаю на любой пункт меню, страница загружается, но не CSS.

Я попытался использовать <link> тег homealter.html для работы CSS, но он не работает.

base.html

 <link href="../static/css/base_style.css" rel="stylesheet" type="text/css">
<div class="menu">
    <table>
        <tr>
            {% with request.resolver_match.url_name as url_name %}
            <td class="{% if url_name == 'home' %}active{% endif %}"><a href="{% url 'home' %}">Resource Wise Analysis</a></td>
            <td class="{% if url_name == 'homealter' %}active{% endif %}"><a href="{% url 'homealter' %}">Land Distance Analysis</a></td>
            <td class="{% if url_name == 'graphsone' %}active{% endif %}"><a href="{% url 'graphsone' %}">Water Type Based Analysis</a></td>
            <td class="{% if url_name == 'graphstwo' %}active{% endif %}"><a href="{% url 'graphstwo' %}">Land Distance Analysis</a></td>
            <td><a href="{% url 'logout' %}">Logout</a></td>
            {% endwith %}
        </tr>
    </table>
</div>
{% block mains %}
{% endblock %}
</body>

homealter.html

 {% extends 'base.html' %}
{% block mains %}
{% load staticfiles %}
<link href="../static/css/base_style.css" rel="stylesheet" type="text/css">
<div class="contnt">
<table>
<tr>
    <th>Land Size</th>
    <th>Land Distances Count</th>
    <!--<th>Details</th>-->
</tr>
{% for index, row in yeye.iterrows %}
<tr>
    <td><p>{{index}}</p></td>
    <td>{{row.Distance}}</td>
    <!--<td><a href="{% url 'yearwise' index %}">View Details</a></td>-->
{% endfor %}
</tr>
</table>
<img src="{% static 'images/im1.jpg' %}">
</div>
{% endblock %}

Раньше это работало, потому что был внутренний CSS base.html . Мне нужно base_style.css работать всякий раз, когда выбираются пункты меню, то есть и на других страницах.

Комментарии:

1. что вы добавляете <link> ? Когда вы открываете страницу в браузере и используете Ctrl U, чтобы увидеть исходный код — видите ли вы эту ссылку в HTML? Скопируйте эту ссылку из HTML и откройте в новой карточке в браузере — она загружается?

2. Я добавил <link> в div, а также вверху, я также создал тег body, но пока ничего не получалось.

3. Я не вижу <link> <div> . Я вижу только одну ссылку на «../static/css/base_style.css», но это не внешняя ссылка. Или, может быть, вы имеете в виду внешнюю папку на диске — браузер не имеет доступа к внешним папкам на диске по соображениям безопасности.

4. В homealter.html , <link> не работает, и я удалил его. Я добавлю его снова.

5. чтобы решить проблему, вы должны показать код, который вы запускаете, и полные ошибки, которые вы получаете.

Ответ №1:

Вы должны иметь его только в base.html , но полный путь (не относительный):

 <link href="/static/css/base_style.css"...

или лучше:

 {% load static %}
<link href="{% static 'css/base_style.css' %}"...