change font color of navigation bar in storefront theme

It should be this in yuur theme’s style.css:

.main-navigation ul li a {
color: #81d742;
}

Though, you really should be creating a Child Theme for any changes, as when the theme updates, all the changes will be lost. Or you could use a Custom CSS plugin.

raymondhcw…

It should be this in yuur theme’s style.css:

.main-navigation ul li a {
color: #81d742;
}

Though, you really should be creating a Child Theme for any changes, as when the theme updates, all the changes will be lost. Or you could use a Custom CSS plugin.

Thanks NeoTechnomad!

I am sorry that I can’t explain my question clearly. My question should be how to change the font color after mouseover the words in navigation bar. I can only change the background color after mouseover.

These are the selectors for an anchor (link).
This particular one is “.main-navigation ul li”.

.main-navigation ul li a:link {
color: #81d742;
}
.main-navigation ul li a:visited {
color: #81d742;
}
.main-navigation ul li a:hover {
color: #81d742;
}
.main-navigation ul li a:focus {
color: #81d742;
}
.main-navigation ul li a:active {
color: #81d742;
}

link is for the link as it is in “rest”, in other words, not being hovered over, etc.
visited is what it says – one which has been visited and one has left it
hover and focus are the same and self-explanatory
active is when someone is on the place where the link leads to, such as a page or post

Change the colors according to what you want them to be. They must be 6 digits, 6 letters, or a combination of both (hex) and letters must be small-case.
Put the 6 digits between the “:” and “;“

Here is a link to some hex colors: 500+ Named Colours with rgb and hex values

Thanks NeoTechnomad!

It works for main navigation! But how can I also change the hover colors of the shopping cart at the right?
https://104.199.133.150/en/