HTML не загружает локальный файл CSS - PullRequest
Новая
       1

HTML не загружает локальный файл CSS

1 голос
/ 04 мая 2019

Я просмотрел одни и те же вопросы о переполнении стека и попробовал все лучшие ответы. Никто из них не работал.

Я изучаю HTML5 с помощью таблицы стилей CSS. Я просмотрел учебник по созданию веб-страницы с формой для входа с помощью фляги. Итак, у него есть этот файл base.html, в котором есть несколько кодовых ссылок на файл CSS: 

<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>RELAX AND WORKOUT</title>
  <link rel="stylesheet" href="bulma.css" />
</head>

Первоначально, после href была ссылка http, и она работала. Но я скачал тот же файл CSS и поместил его в ту же папку, что и файл base.html, чтобы я мог играть с этим файлом CSS.

Они оба на ./project/templates/the_file

Это ссылка для скачивания файла css: https://cdnjs.cloudflare.com/ajax/libs/bulma/0.7.4/css/bulma.css

Первоначально автор учебника ставил после 'href ='. Но когда я изменил его на локальное имя файла 'bulma.css', он вообще не загружает таблицу стилей. Я также попробовал абсолютный путь и относительный путь. Ни один из них не работал. Я использую его на Windows 10. Используя Python 3.7 и флешку. Так в моем случае, как я могу заставить HTML загружать этот локальный файл CSS?

Edit:

Хорошо, я в конце концов заставил это работать.

Я создал новую папку с именем «static» и поместил в нее файл css. Затем я изменил путь к этому:

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

Означает ли это, что колба рассматривает папку «шаблоны» как специальную папку только для шаблонов HTML, она не распознает другие форматы файлов?

Но я увидел вопрос о том, что человек положил свой css-файл в тот же каталог. Ответ - просто добавить точку, и это сработало. Вот почему я поместил его со всеми другими шаблонами HTML в моей папке шаблонов. Но в моем случае это не сработало.

Ответы [ 4 ]

0 голосов
/ 09 мая 2019

Из документов колбы:

Колба автоматически добавляет статическое представление, которое принимает путь относительно каталога flaskr / static и отправляет его.На base.htmltemplate уже есть ссылка на файл style.cssfile: 

{{ url_for('static', filename='style.css') }}

Вам необходимо создать папку с именем static внутри каталога приложения фляги, в котором находятся статические файлы.Пример: CSS, изображения и т. д.

В вашем HTML-коде используйте: 

<head>
    <link rel="stylesheet" href= {{ url_for('static', filename='bulma.css') }}>
</head>
0 голосов
/ 04 мая 2019

Вы уверены, что вам не нужно заходить в папку с шаблонами? «/templates/bulma.css"

0 голосов
/ 04 мая 2019

Нажмите F12, чтобы открыть панель разработки. Перейдите на вкладку сети. Обновите страницу. Файл указан в этом списке? Возможно, вам придется обновить кеш, чтобы он вступил в силу. Для этого: CTRL + SHIFT + R. Если файл указан там, вы можете просмотреть предварительный просмотр, чтобы убедиться, что он актуален, в противном случае вам все равно придется принудительно обновить кэш.

Что касается URL, вы также можете использовать абсолютный путь к файлу, начинающийся с корня с href = "../ project / templates / filename.css" (используйте 2 периода). Ниже приведен веб-сайт для получения дополнительной информации об этом:

https://www.w3schools.com/html/html_filepaths.asp

0 голосов
/ 04 мая 2019

Попробуйте изменить href="bulma.css" на href="./bulma.css" и посмотрите, работает ли он.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...