Html图标未显示在我网站的某些页面上，但显示在其他页面上[重复]答案

【问题标题】：Html icon doesn't show on some pages on my website but shows on the others [duplicate]Html图标未显示在我网站的某些页面上，但显示在其他页面上[重复]
【发布时间】：2020-07-25 21:44:22
【问题描述】：

我的网站很小，但图标无法正常工作：代码如下：

base.html

<html>
    <head>
        <link rel="icon" href="static/icon.png" sizes="32x32">
        <title>
            {% block title %}{{title}}{% endblock %}
        </title>
        <link rel="stylesheet" href="{{ url_for('static', filename='styles.css') }}"/>
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
    </head>
    <body>
        <div id="page_container">
            {% block content %}
            <div class="container-fluid" style="margin-top: 100px;">
                {% with messages = get_flashed_messages() %}
                {% if messages %}
                    {% for message in messages %}
                    <div class="alert alert-info" role="alert">{{message}}</div>
                    {% endfor %}
                {% endif %}
                {% endwith %}

                {# application content needs to be provided in the app_content block #}
                {% block app_content %}{% endblock %}
            </div>
            {% endblock %}
        </div>
    </body>
</html>

浏览器在此模板上显示图标：

关于.html

{% extends "base.html" %}
{% block app_content %}
<div id="about_author_photo">
    <img src="static/VVphoto.jpg" height="400px" width="270px">
</div>
{% endblock %}

但它不是这样的：

诗歌.html

{% extends "base.html" %}
{% block app_content %}

    {% for poem in poems.items %}
        {% include "_poem.html" %}
    {% endfor %}

    <div class="pagination-links">
    {% for page in poems.iter_pages() %}
        {% if page %}
            {% if page != poems.page %}
                <a href="{{ url_for('poems', page_num=page) }}">{{ page }}</a>
            {% else %}
                <span style="color: white;">({{ page }})</span>
            {% endif %}
        {% else %}
            <span class=ellipsis style="color: white;">…</span>
        {% endif %}
    {% endfor %}
    </div>

{% endblock %}

以下是他们俩的观点：

@app.route('/')
@app.route('/about')
def about():
    return render_template('about.html', title='З Гумором Про Все На Світі')


@app.route('/poems/<int:page_num>')
def poems(page_num):
    poems = Poem.query.paginate(per_page=5, page=page_num, error_out=True)
    return render_template('poems.html', title='Вірші',  poems=poems)

我尝试将图标添加到 {% extends "base.html %} 行下的诗歌 tepmlate 但它不起作用

【问题讨论】：

标签： python html css flask

【解决方案1】：

图标 url 目前是相对的。你应该使用{{ url_for('static', filename='icon.png') }}

【讨论】：

你真是个天才先生，非常感谢！

【解决方案2】：

您的图标位置使用的是相对于您当前页面的路径。

<link rel="icon" href="static/icon.png" sizes="32x32">

在 about 或 home 页面上，您将使用 domain.com/ 或 domain.com/about 作为您的 url。这将导致浏览器在domain.com/static/icon.png 处查找图标。在诗歌页面上，您似乎总是在特定页面上，例如domain.com/poems/1，这使得相对路径domain.com/poems/static/icon.png。

为确保路径始终相对于域的根目录，请在路径前加上 /，以便在您的 base.html 中看起来像这样

<link rel="icon" href="/static/icon.png" sizes="32x32">

【讨论】：