CSS: Class name selector- name starts with

Question

I have two different type of class names. The first are named color-*. For example:

color-red
color-blue
color-green

I also ha

Answer 1

The selector you are using *= matches any attribute containing that string.

Instead, you want ^=, which matches any attribute beginning with that string.

A combination would work best:

a[class^='color-'], a[class*=' color-'] { ... }

See MDN page on CSS attribute selectors and this other SO answer.