如何在PythonAnywhere的Dash应用中引入本地styles.css文件？

修改Dash应用初始化代码 #

你可以通过两种方式引入本地的styles.css，具体操作如下：

方法一：利用Dash自动加载assets目录（推荐） #

1. 调整项目结构：将原有的static文件夹重命名为assets，确保结构如下：

   你的项目文件夹/
   ├── app.py
   └── assets/
       └── styles.css
   

   Dash默认会自动扫描assets目录下的CSS、JS等静态资源并加载，无需额外配置路径。

2. 保持原有初始化代码不变即可，Dash会自动叠加加载assets里的样式：

   app = dash.Dash(external_stylesheets=[dbc.themes.BOOTSTRAP, dbc.icons.BOOTSTRAP])
   

方法二：手动指定静态文件目录 #

如果不想修改static文件夹名称，可手动指定静态资源目录路径：

1. 保留原项目结构：

   你的项目文件夹/
   ├── app.py
   └── static/
       └── styles.css
   

2. 修改初始化代码，添加assets_folder参数指向static目录：

   app = dash.Dash(
       external_stylesheets=[dbc.themes.BOOTSTRAP, dbc.icons.BOOTSTRAP],
       assets_folder='static'
   )
   

额外注意事项 #

• 部署到PythonAnywhere时，要确保服务器上的项目结构和本地完全一致，app.py与静态文件夹处于同一层级。
• 若下拉菜单样式仍不生效，检查styles.css中的选择器是否正确（比如Dash下拉组件的类名如.Select、.Select-menu-outer），可通过调整选择器优先级或临时添加!important测试样式是否生效。

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