Html文件不是'；我的css文件没有崩溃吗？_Html_Css_Frontend_Web Frontend

Html文件不是'；我的css文件没有崩溃吗？

html css

Html文件不是'；我的css文件没有崩溃吗？,html,css,frontend,web-frontend,Html,Css,Frontend,Web Frontend,我所有的html、css和文件都在同一个templates文件夹中，所以我认为这不是问题所在。我是全新的前端开发和深深困惑。。。请帮忙，这不是一个好的开始哈哈 --My base.html文件-- 也许这是我的css的问题？谢谢大家! 我认为问题在于您的服务器，我假设您使用的是Flask，因为您正在html文件中编写Jinja语法，我认为问题在于Flask找不到您的css文件。您需要准确地告诉它在哪里查找您的静态文件，或者您可以制作一个路由器来处理文件请求，读取文件并将其发送回浏览器第一条路

我所有的html、css和文件都在同一个templates文件夹中，所以我认为这不是问题所在。我是全新的前端开发和深深困惑。。。请帮忙，这不是一个好的开始哈哈

--My base.html文件--

也许这是我的css的问题？谢谢大家!

我认为问题在于您的服务器，我假设您使用的是

Flask

，因为您正在html文件中编写Jinja语法，我认为问题在于Flask找不到您的css文件。您需要准确地告诉它在哪里查找您的静态文件，或者您可以制作一个路由器来处理文件请求，读取文件并将其发送回浏览器

第一条路

从烧瓶导入烧瓶，渲染\u模板
app=烧瓶（名称），
静态url路径=“”，
静态文件夹='static'，
模板（文件夹=“模板”）
@应用程序路径（“/”）
def主页面（）：
返回渲染模板（“index.html”）

现在Flask将在文件夹中查找您的静态文件

“static”

，您需要创建它，然后将静态文件（包括css文件）放在那里，并保持html文件不变，不要将css文件的路径更改为包含文件夹名称，因为Flask将像脚本的当前目录中一样使用它

第二条路

从烧瓶导入烧瓶，呈现模板，请求，响应
app=烧瓶（名称）
@应用程序路径（“/”）
def主页面（）：
返回渲染模板（“index.html”）
@app.route（“/css”）
def giveCSS（）：
fileContent=“”
文件名=request.args.get（“名称”）
如果（文件名）：
文件=打开（“css/”+文件名+”.css，“r”）
对于文件中的行：
fileContent+=行
返回响应（fileContent，mimetype='text/css'）

我假设您有其他css文件，您需要更改html文件中css文件的路径，以包括查询

/css/name=main

，css文件可能位于名为

“css”

的文件夹中。当然，您可以更改任何您不喜欢的名称，但请务必小心。

您能否澄清问题的确切原因？您的CSS样式没有应用到HTML？可能是缓存问题。您是否清除了web浏览器的缓存？您知道如何使用chrome的开发工具吗？检查“网络”选项卡，查看是否找到了所有css文件，或提供网站链接检查浏览器开发工具的“网络”选项卡：是否正确加载了

main.css

？这个问题每天必须在这里问十次。我知道它每天在论坛和互联网上被问到数百次。谢谢你！我要花一个星期才能弄明白。第一个很好用！

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>{% block title %}{% endblock %}</title>
    <link rel="stylesheet" type="text/css" href="main.css"/>
</head>
<body>
    <nav class="navigation_bar">
        <ul>
            <li>
                <a href="/about"><b>about page</b></a>
            </li>
        </ul>
    </nav>
    {% block content %}{% endblock %}
</body>
</html>

@import url('https://fonts.googleapis.com/css?family=Montserrat:400,600');

body {
    text-align: center;
    font-family: 'Montserrat';
}



.navigation_bar a {
    text-decoration: none;
}