Flask框架下按公司筛选帖子的页面继承layout.html样式失效求助

问题根因排查 #

1. 核心原因：未传入title参数导致全局样式未加载 #

你在layout.html的头部做了条件判断，只有当前模板接收到title变量时，才会加载全局自定义样式main.css：

{% if title %}
<link rel="stylesheet" type="text/css" href="{{url_for('static', filename='main.css')}}">
<title>{{ title }} | CVLink</title>
{% else %}
<title>CVLink</title>
{% endif %}

但你的company_posts路由在渲染模板时，仅传入了posts参数，没有传递title，导致条件判断不触发，main.css没有被引入，自然全局样式失效。
解决方法：修改路由的模板渲染代码，补充title参数即可：

return render_template('company_posts.html', posts=posts, title=company)

2. 潜在问题：子模板冗余声明DOCTYPE #

company_posts.html作为继承layout.html的子模板，不需要重复写<!DOCTYPE html>声明，多余的标签可能会引发浏览器渲染异常，直接删掉子模板开头的这行代码即可。

3. 辅助排查手段 #

如果修改后仍有样式异常，可以打开浏览器F12开发者工具：

• 切换到「控制台」标签，查看是否有资源加载报错
• 切换到「网络」标签，筛选CSS资源，查看main.css的加载状态，确认是否是路径配置问题导致的加载失败

内容的提问来源于stack exchange，提问作者Chidera Chukwumah