Блог

Главная - Вопросы по программированию - Flask не использует мои спецификации стиля css

Flask не использует мои спецификации стиля css

#html #css

#HTML #css

Вопрос:

Я программирую приложение flask. В этом у меня есть основной HTML-файл:

 <!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Table generator</title>

    <link rel="stylesheet" href="/static/lib/skeleton/normalize.css" />
    <link rel="stylesheet" href="/static/lib/skeleton/skeleton.css" />
    <link rel="stylesheet" href="/static/style.css" />
</head>
<body>
    <div class="container">
        <ul class="navigation">
            <li class="navigation-item">
                <a href="/">Home</a>
            </li>
            <li class="navigation-item">
                <a href="/instructions">Instructions</a>
            </li>
        </ul>

        {% block content %}{% endblock %}
    </div>
</body>
</html>

для моей таблицы стилей я связал этот файл css:

 .navigation {
    list-style-type = none;
}

Но когда я запускаю файл, список по-прежнему выглядит так:
введите описание изображения здесь

Я хочу, чтобы в моем списке не было точек впереди. Что я делаю не так?

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

1. Я не думаю, что это допустимый css. Так и должно быть list-style-type: none; (т.е. используйте двоеточие, а не знак равенства).

2. Вы всегда должны позволять flask / jinja обрабатывать эти ссылки. <link rel="stylesheet" href="{{ url_for('static', filename='style.css') }}" /> . Недостаточно информации, чтобы узнать, исправит ли это само по себе, но это шаблон, который вы должны использовать

3. Отображается ли в журнале веб-сервера успешное получение файла css?

4. Как я могу получить эту информацию

5. Кстати, я заменил = на a : и это ничего не меняет

Ответ №1:

Этот код будет работать, вам нужно применить этот стиль к самому элементу списка.

 .navigation li{
  list-style-type: none;
} 
 <!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Table generator</title>

    <link rel="stylesheet" href="/static/lib/skeleton/normalize.css" />
    <link rel="stylesheet" href="/static/lib/skeleton/skeleton.css" />
    <link rel="stylesheet" href="/static/style.css" />
</head>
<body>
    <div class="container">
        <ul class="navigation">
            <li class="navigation-item">
                <a href="/">Home</a>
            </li>
            <li class="navigation-item">
                <a href="/instructions">Instructions</a>
            </li>
        </ul>
    </div>
</body>
</html>

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

1. почему бы .navigation {list-style-type: none;} вместо того , чтобы применять его к каждому отдельному ребенку ?

2. Я попытался скопировать и запустить ваш код точно так, как вы его написали, но это не сработало

3. дает ли «фрагмент кода запуска» соответствующие результаты? У меня это работает в chrome / IE / FF. Какой браузер вы используете?

4. Я использую chrome.

Метки: