css - 我可以覆盖 Prestashop 中的 scss 样式吗？

Question

我在 Prestashop 1.6 中使用默认主题时遇到问题。我想要完成的是将导航栏简单地移动 25px。我知道我需要删除或更改

#block_top_menu {
padding-top: 25px;
}

在 blocktopmenu.scss 中，它不在模块目录中，而是在主题目录中，我认为它应该覆盖默认样式。当我在浏览器检查器工具中禁用它时，它会完全按照我想要的方式更改，但显然不会保存。

我编辑了文件，将 25px 更改为 0px。当我重新加载页面时，没有任何变化，检查器仍然显示代码，就好像我从未修改过它一样。所以我编辑了模块类别中的 blocktopmenu.css，添加了 !important，如下所示:

#block_top_menu {
padding-top: 0px !important;
}

希望覆盖 scss。仍然没有发生任何变化。无奈之下，我从服务器上删除了scss文件。仍然没有变化，Inspector 显示的文件就好像它就在那里一样。

我没主意了。我应该以某种方式清除 prestashop 的缓存还是什么？请帮忙。

编辑:我清除了缓存。没有变化。

Answer 1

文件 default-bootstrap/sass/modules/blocktopmenu/css/blocktopmenu.scss编译成 default-bootstrap/css/modules/blocktopmenu/css/blocktopmenu.css

如果您找到了.scss文件，那么一定也存在相应的.css文件。

现在大多数用户直接修改.css文件并没有什么问题，但是如果你要做很多样式更改(比如更改整个网站的配色方案)可能会更好更改.scss 文件并将它们编译成.css。如果您更改 .scss 中的主题变量，它会在所有使用过的地方发生变化。这样您只需要编辑一个地方而不是 X 个地方。

要使用.scss，您需要两个工具:sass 和compass。您需要为您的操作系统搜索安装说明。

在您的系统上安装这些工具后，您需要在主题文件夹中的控制台中运行命令(因为不同的主题 = 不同的风格):

/var/www/themes/theme1/> 指南针构建

在主题文件夹中运行 compass build 会将 .scss 文件编译成 .css 并将它们放置在(主题的)css 文件夹中.