css - Bootstrap 3 css 覆盖仅适用于本地主机

Question

我正在使用 bootstrap 3 和 web2py。

我想使用 Bootstrap 中的主要面板，但背景颜色不起作用，而且正文的填充过多。

我有自己的 css 文件，该文件在 Bootstrap 后加载，以在我自定义我的应用程序时覆盖各种内容。

<link rel="stylesheet" href="{{=URL('static','css/bootstrap.min.css')}}"/>
<link rel="stylesheet" href="{{=URL('static','css/web2py-bootstrap3.css')}}"/>
<link rel="stylesheet" href="{{=URL('static','css/offertool.css')}}"/>

对于面板，我在 offertool.css 文件中有这个:

    .list-group-item {
    padding: 5px 5px;
}

.panel-primary .panel-title {
    background-color: #1E90FF;
}

这在本地工作得很好，然后我上传了应用程序，我的 css 停止工作。添加 !important 没有用，我什至试图通过将这些样式添加为内联样式作为临时修复来破解它，但它什么也没做。

为什么在我的本地主机上工作但没有上传？

Answer 1

在尝试覆盖 Bootstrap 样式时，我遇到过几次这种情况。通常通过检查以下内容可以找到罪魁祸首:

• 清除缓存(以 Chrome 隐身模式打开页面)。如果您使用的是 cloudflare，请将您的站点设置为开发模式。如果您的网站有缓存脚本，也请清除它们。
• 检查标题中的 CSS 链接，确保您上传了最新版本的标题。
• 确保您的上传确实在更新，在 chrome 检查器中检查您的 css 文件的源表。
• 重新上传所有文件，而不仅仅是您的 css 文件，确保您的服务器镜像您的本地主机。

如果在您检查了所有这些之后它仍然没有显示，我不知道该告诉您什么。 !important 不会覆盖样式的唯一原因是该样式是否为内联样式。