CSS lädt nicht mit Flask

Ich baute mein Backend mit Python Flask und testete es mit grundlegenden HTML-Vorlagen ohne CSS und es funktionierte kein Problem. Wenn ich jedoch versucht habe, Bootstrap zu implementieren, wird das CSS nicht geladen. Ich habe die CSS- und JS-Dateien in einem statischen Ordner abgelegt.CSS lädt nicht mit Flask

Hier ist der Bootstrap HTML-Markup:

<!DOCTYPE html> 
<html lang="en"> 
    <head> 
    <meta charset="utf-8"> 
    <meta http-equiv="X-UA-Compatible" content="IE=edge"> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
    <!-- The above 3 meta tags *must* come first in the head; any other head  content must come *after* these tags --> 
    <meta name="description" content=""> 
    <meta name="author" content=""> 
    <link rel="icon" href="../../favicon.ico"> 

    <title>Simple Safety</title> 

    <!-- Bootstrap core CSS --> 
    <link href="{{ url_for('static', filename ='bootstrap.min.css') }}" rel="stylesheet"> 

    <!-- IE10 viewport hack for Surface/desktop Windows 8 bug --> 
    <link href="{{ url_for('static', filename =ie10-viewport-bug-workaround.css') }}" rel="stylesheet"> 

    <!-- Custom styles for this template --> 
    <link href="{{ url_for('static', filename ='style.css') }}" rel="stylesheet"> 

    <!-- Just for debugging purposes. Don't actually copy these 2 lines! --> 
    <!--[if lt IE 9]><script src="../../assets/js/ie8-responsive-file-warning.js"></script><![endif] 
    <script type="text/javascript" src="{{ url_for('static', filename = 'ie-emulation-modes-warning.js') }}"></script>--> 

    <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries --> 
    <!--[if lt IE 9]> 
     <script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"> </script> 
     <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"> </script> 
    <![endif]--> 
    </head> 

<!--Main Content--> 

    <!-- Bootstrap core JavaScript 
    ================================================== --> 
    <!-- Placed at the end of the document so the pages load faster --> 
    <script src="{{url_for('https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/', filename='jquery.min.js') }}"></script> 
    <script>window.jQuery || document.write("<script type='text/javascript' src='{{ url_for('static', filename='jquery.min.js') }}''><\/script>")</script> 
    <script type="text/javascript" src="{{ url_for('static', filename ='bootstrap.min.js') }}"></script> 
    <!-- IE10 viewport hack for Surface/desktop Windows 8 bug --> 
    <script type="text/javascript" src="{{ url_for('static', filename='ie10-viewport-bug-workaround.js') }}"></script> 
    </body> 
</html>

Quelle

2017-08-29 JTP709

Ich erkennen, dass ich meine ‚statischen‘ Ordner in den ‚Vorlagen‘ Ordner, eine alte Gewohnheit, die ich mit Front-End-Anwendungen nur tat gestellt hatte. Sie müssen den Ordner "static" im Verzeichnis mit dem Ordner templates platzieren.

Quelle

2017-08-29 12:26:57 JTP709

CSS lädt nicht mit Flask

Antwort

Verwandte Themen