user14225279
user14225279

Reputation:

Generalization in CSS selectors is possible?

I can write this selector condition:

h1:not(footer)
, h2:not(footer)
, h3:not(footer)
, h4:not(footer)
, h5:not(footer)
, h6:not(footer) {
    font-family: "Luckiest Guy";
    }

but, exists anything easy to use like:

(h1, h2, h3, h4, h5, h6):not(footer) {
    font-family: "Luckiest Guy";
    }

Upvotes: 0

Views: 223

Answers (1)

Techuila
Techuila

Reputation: 1287

This is where css preprocessor comes in, you can add variables and functions for efficient development. It also makes your code more organized and clean.

Try using SASS, you can do that with:

h1, h2, h3, h4, h5, h6 {
    &:not(footer) {
        font-family: "Luckiest Guy";
    }
}

It will compile this and generate a new css file that is equivalent to the code above.

Link to sass: https://sass-lang.com/

Upvotes: 1

Related Questions