Tip: Style links without a class

CSS, Visual, Interactivity · Nov 23, 2022

When styling injected or generated HTML content, you might not have access to the classes or IDs of the elements you want to style. This can become especially annoying when dealing with link elements. Luckily, you can use the :not() selector with an appropriate attribute selector to check for the absence of a class and style links accordingly.

a[href]:not([class]) {
  color: #0077ff;
  text-decoration: underline;
}

As a bonus tip, you can use the previous tip about selecting any link to further enhance this solution.

Written by Angelos Chalaris

I'm Angelos Chalaris, a JavaScript software engineer, based in Athens, Greece. The best snippets from my coding adventures are published here to help others learn to code.

If you want to keep in touch, follow me on GitHub or Twitter.

More like this