sass - Zurb Foundation : Semi transparent top bar possible?

有什么办法可以使Zurb Foundation具有半透明的顶部条形？

据我所知，我已经在_settings.scss文件中定义了所有相关变量:

$topbar-bg-color
$topbar-bg
$topbar-dropdown-bg
$topbar-dropdown-link-bg
$topbar-dropdown-label-bg

并且尝试了所有数量的变体形式(alpha值在0-0.5之间的rgba)，并且始终以完全透明的条形或半透明的条形结束，并且下拉菜单/按钮将其背景堆叠在顶部，因此显得较暗/更不透明。

有什么办法可以使顶部栏始终是半透明的？

我可以在样式表中看到.top-bar-section li a:not(.button)总是具有背景色。我知道我可以在自己的样式表中手动覆盖它，但是我觉得必须有一种设置变量的方法，这样这些按钮才不会显得更暗？

最佳答案

屏幕快照右侧链接的背景由$topbar-dropdown-bg变量设置。您需要将其更改为none或transparent。

其他步骤是:

将背景颜色变量设置为none。

将$topbar-bg-color设置为半透明值，例如rgba(#333,0.5)。

这是 demo 。我尝试注释所有将背景设置为none的变量。

关于sass - Zurb Foundation : Semi transparent top bar possible?，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/20686128/