使用 CSS 滚动时使 Nav-Bar 文本改变颜色

Question

我有一个header是透明的，但是滚动的时候变实了，问题出现是因为headers Nav-Bar菜单的文字颜色没有随着header，人们需要这样做的原因有多种。

所以我试图让 Nav-Bar 菜单文本在滚动时改变颜色，我想知道我可以重新调整 CSS 的用途以获得 header 的透明度以适应这个新的目的，我只是不知道如何。

下面的CSS是为了改变滚动时的透明度：

selector.elementor-sticky--effects{
background-color: rgba(255,255,255,255)!important
}

selector{
transition: background-color 1s ease !important;
}

selector.elementor-sticky--effects >.elementor-container{
min-height: 70px;
}

selector > .elementor-container{
transition: min-height 1s ease !important;
}

我需要重新调整上述 CSS 的用途，以便它改变 Nav-Bar 的颜色而不是 background-color 的透明度。

这里是 CSS 用于设置 Nav-Bar 的颜色：

.elementor-nav-menu a {
    color: #001C38 !important;
}

Answer 1

我明白了，滚动效果是 wordpress 的 Elementors 插件的一部分。

导航栏项目是链接，因此我可以用这个来定位它们

selector.elementor-sticky
--effects a,selector
.elementor-sticky--effects i{
    color: #001C38 !important;

并且由于 --effects

而具有与其他滚动效果相同的效果

使用 CSS 滚动时使 Nav-Bar 文本改变颜色

Make Nav-Bar text change color when scrolling with CSS

html

css

wordpress

frontend

header