DEV Community

Cover image for Sass: Placeholder Selector 📎
Akram A. Abdelbasir
Akram A. Abdelbasir

Posted on • Updated on

Sass: Placeholder Selector 📎

Our series is split into two main categories: SASS rules and SASS at-rules, if you recall the course mindmap from the sass syntax post. The one SASS rule we didn't cover in the previous posts was Placeholder Selector, so now we're going to talk about it.

Placeholder Selector

A sass placeholder is a special sass selector that begins with a % and it is used to hold CSS styles blocks like this one in the example below:

Example on how to write placeholder selector

Although it is comparable to a class selector, it is not converted into CSS code.

How then may this selection be of use?

A placeholder may be seen as a box that contains a block of CSS styles that can be applied in many ways without repeating, thanks to the sass at-rule "@extend."

another example on placeholder selector

Finally, we can say that the posts that will come after this one will introduce SCSS at-rules.

See You 😉

Top comments (0)