Меню

Flask css не работает

CSS Problems with Flask Web App

I can’t get the CSS to output correctly — my webpages are all unstyled.

This is my link in all my templates. What am I doing wrong?

Is there anything special that I have to do with Flask to get it to work?

I’ve been trying and changing things for about half an hour but can’t seem to get it right.

To sum it up: How do you do CSS with Flask — do I have to have any special python code?

11 Answers 11

You shouldn’t need to do anything special with Flask to get CSS to work. Maybe you’re putting style.css in flask_project/stylesheets/ ? Unless properly configured, such directories won’t be served by your application. Check out the Static Files section of the Flask Quickstart for some more information on this. But, in summary, this is what you’d want to do:

Move static files you need to project_root/static/ . Let’s assume that you moved stylesheets/style.css into project_root/static/stylesheets/style.css .

This tells the template parser (Jinja2) to tell Flask to find the configured static directory in your project directory (by default, static/ ) and return the path of the file.

  • If you really wanted to, you could just set the path as /static/stylesheets/style.css . But you really shouldn’t do that — using url_for allows you to switch your static directory and still have things work, among other advantages.

And, as @RachelSanders said in her answer:

In a production setting, you’d ideally serve your static files via apache or nginx, but this is good enough for dev.

Источник

Application not picking up .css file (flask/python)

I am rendering a template, that I am attempting to style with an external style sheet. File structure is as follows.

mainpage.html looks like this

None of my styles are being applied though. Does it have something to do with the fact that the html is a template I am rendering? The python looks like this.

I know this much is working, because I am still able to render the template. However, when I tried to move my styling code from a «style» block within the html’s «head» tag to an external file, all the styling went away, leaving a bare html page. Anyone see any errors with my file structure?

13 Answers 13

You need to have a ‘static’ folder setup (for css/js files) unless you specifically override it during Flask initialization. I am assuming you did not override it.

Your directory structure for css should be like:

Notice that your /styles directory should be under /static

Flask will now look for the css file under static/styles/mainpage.css

In jinja2 templates (which flask uses), use

The static files are usually in the static folder, though, unless configured otherwise.

Still having problems after following the solution provided by codegeek:

?

In Google Chrome pressing the reload button (F5) will not reload the static files. If you have followed the accepted solution but still don’t see the changes you have made to CSS, then press ctrl + shift + R to ignore cached files and reload the static files.

Читайте также:  Как правильно настроить котел зота люкс

In Firefox pressing the reload button appears to reload the static files.

In Edge pressing the refresh button does not reload the static file. Pressing ctrl + shift + R is supposed to ignore cached files and reload the static files. However this does not work on my computer.

I have read multiple threads and none of them fixed the issue that people are describing and I have experienced too.

I have even tried to move away from conda and use pip, to upgrade to python 3.7, i have tried all coding proposed and none of them fixed.

And here is why (the problem):

by default python/flask search the static and the template in a folder structure like:

you can verify by yourself using the debugger on Pycharm (or anything else) and check the values on the app (app = Flask(name)) and search for teamplate_folder and static_folder

in order to fix this, you have to specify the values when creating the app something like this:

the path TEMPLATE_DIR and STATIC_DIR depend on where the file app is located. in my case, see the picture, it was located within a folder under src.

you can change the template and static folders as you wish and register on the app = Flask.

In truth, I have started experiencing the problem when messing around with folder and at times worked at times not. this fixes the problem once and for all

Источник

Приложение не загружает файл .css (flask / python)

Я визуализирую шаблон, который пытаюсь стилизовать с помощью внешней таблицы стилей. Файловая структура выглядит следующим образом.

mainpage.html выглядит так

Однако ни один из моих стилей не применяется. Связано ли это с тем, что HTML — это шаблон, который я визуализирую? Питон выглядит так.

Я знаю, что это работает, потому что я все еще могу визуализировать шаблон. Однако, когда я попытался переместить свой код стиля из блока style внутри тега head html во внешний файл, все стили исчезли, оставив пустую страницу html. Кто-нибудь видит какие-либо ошибки в моей файловой структуре?

Вам необходимо настроить «статическую» папку (для файлов css / js), если вы специально не переопределите ее во время инициализации Flask. Я предполагаю, что вы не отменяли это.

Ваша структура каталогов для css должна быть такой:

Обратите внимание, что ваш каталог / styles должен находиться в / static

Затем сделайте это

Flask теперь будет искать файл css в static / styles / mainpage.css

В шаблонах jinja2 (которые использует флакон) используйте

Однако static файлы обычно находятся в static папке, если не указано иное.

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

Я даже попытался отойти от conda и использовать pip, чтобы перейти на python 3.7, я перепробовал все предложенные коды, и ни один из них не исправлен.

И вот почему (проблема):

по умолчанию python / flask выполняет поиск статического и шаблона в структуре папок, например:

Читайте также:  Кто может починить инстаграм

вы можете проверить самостоятельно, используя отладчик Pycharm (или что-то еще), и проверить значения в приложении (app = Flask ( name )) и найти teamplate_folder и static_folder

чтобы исправить это, вы должны указать значения при создании приложения примерно так:

путь TEMPLATE_DIR и STATIC_DIR зависит от того, где находится файловое приложение. в моем случае, смотрите картинку, она находилась в папке в src.

вы можете изменить шаблон и статические папки по своему усмотрению и зарегистрироваться в app = Flask .

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

Источник

Приложение не получает файл .css (flask / python)

Я рендеринг шаблона, который я пытаюсь стилизовать с помощью внешней таблицы стилей. Файловая структура выглядит следующим образом.

Mainpage.html выглядит так

Ни один из моих стилей не применяется, хотя. Имеет ли это какое-то отношение к тому факту, что html — это шаблон, который я отображаю? Питон выглядит так.

Я знаю, что это работает, потому что я все еще могу сделать шаблон. Однако, когда я попытался переместить свой код стиля из блока «style» в теге «head» html во внешний файл, все стилирование ушло, оставив голую страницу html. Кто-нибудь видит какие-либо ошибки с моей файловой структурой?

7 ответов

Вам необходимо иметь «статическую» настройку папки (для файлов css / js), если вы не перезаписали ее во время инициализации Flask. Я предполагаю, что вы не изменили это.

Ваша структура каталогов для css должна быть такой:

Обратите внимание, что ваш каталог / styles должен находиться в / static

Затем сделайте это

Flask теперь будет искать файл css в static / styles / mainpage.css

Я почти уверен, что он похож на шаблон Laravel, именно так я и сделал.

Я сейчас использую колбу версии 1.0.2. Вышеуказанные файловые структуры не работали для меня, но я нашел такую, которая выглядит следующим образом:

(Обратите внимание, что «static» и «templates» — это папки, имена которых должны называться одинаково.)

Чтобы проверить версию колбы, которую вы используете, вы должны открыть Python в терминале и ввести следующее:

Структура проекта колбы отличается. Как вы упомянули в вопросе, структура проекта такая же, но единственная проблема заключается в папке стилей. Папка Styles должна входить в статическую папку.

В шаблонах jinja2 (которые использует колба) используйте

Файлы static обычно находятся в папке static , если не указано иное.

По-прежнему возникают проблемы после выполнения решения, предоставленного codegeek:

?

В Google Chrome нажатие кнопки перезагрузки (F5) не приводит к перезагрузке статических файлов. Если вы следовали принятому решению, но все еще не видите изменений, внесенных в CSS, нажмите ctrl + shift + R , чтобы игнорировать кэшированные файлы и перезагрузить статические файлы.

В Firefox нажмите кнопку перезагрузки, чтобы перезагрузить статические файлы.

При Edge нажатие кнопки обновления не перезагружает статический файл. Предполагается, что нажатие ctrl + shift + R игнорирует кэшированные файлы и перезагружает статические файлы. Однако это не работает на моем компьютере.

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

Читайте также:  Как отремонтировать дверной порог

Я даже пытался отойти от conda и использовать pip, чтобы перейти на python 3.7, я попробовал все предложенное кодирование и ни одно из них не исправлено.

И вот почему (проблема):

По умолчанию python / flask выполняет поиск статического и шаблона в структуре папок, например:

Вы можете проверить это самостоятельно с помощью отладчика в Pycharm (или чего-либо еще) и проверить значения в приложении (app = Flask ( name )) и выполнить поиск teamplate_folder и static_folder.

Чтобы это исправить, вы должны указать значения при создании приложения примерно так:

Пути TEMPLATE_DIR и STATIC_DIR зависят от того, где находится файловое приложение. в моем случае, смотрите картинку, она находилась в папке под src.

Вы можете изменить шаблон и статические папки по своему желанию и зарегистрироваться в приложении = Flask .

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

Источник

Приложение не загружает файл .css (flask / python)

Я визуализирую шаблон, который пытаюсь стилизовать с помощью внешней таблицы стилей. Файловая структура выглядит следующим образом.

mainpage.html выглядит так

Однако ни один из моих стилей не применяется. Связано ли это с тем, что HTML — это шаблон, который я визуализирую? Питон выглядит так.

Я знаю, что это работает, потому что я все еще могу визуализировать шаблон. Однако, когда я попытался переместить свой код стиля из блока style внутри тега head html во внешний файл, все стили исчезли, оставив пустую страницу html. Кто-нибудь видит какие-либо ошибки в моей файловой структуре?

Вам необходимо настроить «статическую» папку (для файлов css / js), если вы специально не переопределите ее во время инициализации Flask. Я предполагаю, что вы не отменяли это.

Ваша структура каталогов для css должна быть такой:

Обратите внимание, что ваш каталог / styles должен находиться в / static

Затем сделайте это

Flask теперь будет искать файл css в static / styles / mainpage.css

В шаблонах jinja2 (которые использует флакон) используйте

Однако static файлы обычно находятся в static папке, если не указано иное.

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

Я даже попытался отойти от conda и использовать pip, чтобы перейти на python 3.7, я перепробовал все предложенные коды, и ни один из них не исправлен.

И вот почему (проблема):

по умолчанию python / flask выполняет поиск статического и шаблона в структуре папок, например:

вы можете проверить самостоятельно, используя отладчик Pycharm (или что-то еще), и проверить значения в приложении (app = Flask ( name )) и найти teamplate_folder и static_folder

чтобы исправить это, вы должны указать значения при создании приложения примерно так:

путь TEMPLATE_DIR и STATIC_DIR зависит от того, где находится файловое приложение. в моем случае, смотрите картинку, она находилась в папке в src.

вы можете изменить шаблон и статические папки по своему усмотрению и зарегистрироваться в app = Flask .

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

Источник

Adblock
detector