Maison  >  Article  >  interface Web  >  Pourquoi mon application Flask ne charge-t-elle pas mon fichier CSS ?

Pourquoi mon application Flask ne charge-t-elle pas mon fichier CSS ?

Mary-Kate Olsen
Mary-Kate Olsenoriginal
2024-11-27 02:47:10375parcourir

Why Isn't My Flask App Loading My CSS File?

L'application ne récupère pas le fichier .css : un guide pour modifier la structure des fichiers Flask

Lors du style des feuilles de style externes dans une application Flask, il Il est nécessaire de structurer les fichiers de manière appropriée pour garantir que les styles sont appliqués avec succès. Si les styles ne sont pas appliqués, la structure du fichier devra peut-être être ajustée.

Dans l'exemple donné, la feuille de style externe se trouve dans /styles/mainpage.css, tandis que le modèle HTML essaie de la charger. à partir de ../styles/mainpage.css. Ce chemin incorrect empêche probablement les styles de s'appliquer.

Pour résoudre ce problème, la structure du fichier doit être modifiée pour placer la feuille de style dans le dossier « statique » de l'application. La structure du fichier mise à jour devrait ressembler à ceci :

/app
    - app_runner.py
    /services
        - app.py 
    /templates
        - mainpage.html
    /static
        /styles
            - mainpage.css

Ensuite, le modèle HTML doit être ajusté pour charger correctement le fichier CSS :

<link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='styles/mainpage.css') }}">

Ce code HTML modifié utilise la fonction url_for pour générer dynamiquement l'URL correcte pour le fichier CSS, en garantissant que Flask puisse le trouver dans le dossier « statique ». Après la mise en œuvre de ces modifications, les styles externes doivent maintenant être appliqués au modèle rendu.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn