CSS Functional Pseudo-Class selectors is() and where()

Опубликовано: 03 Август 2022
на канале: Technical Potpourri

204

In this video you’ll learn how to simplify your CSS code, turning long verbose selectors into something much more efficient with :is() and :where() pseudo-classes.

Long selector lists can occasionally result from developing CSS in order to target numerous items with the same style rules. A CSS pseudo-class is a keyword added to a selector that specifies a special state of the selected element(s).

Both :is() and :where() are pseudo-class functions that will help shorten and avoid repetition in creating the selectors. They both take an array of arguments of selectors (ids, classes, tags, etc..) and selects any element that can be selected in that list.

📌Blog: https://sudipta-deb.in/2022/08/unders...
📌Understand Basic CSS Selectors and Specificity: https://sudipta-deb.in/2021/08/unders...
📌Youtube video to understand basic CSS Selectors and specificity:    • Learn Basic CSS Selectors in 15 Mins ...

▬ Contents of this video ▬▬▬▬▬▬▬▬▬▬
0:00 - Introduction
0:28 - Introduction of :is() and why we need this?
2:55 - #1 Complex Example of :is()
4:47 - #2 Complex Example of :is()
6:28 - #3 Complex Example of :is()
7:52 - Introduction of :where() and difference with :is()
8:36 - Basic usage of :where()
9:10 - Understand specificity with :is() and :where()
11:40 - Conclusion

#css #selectors #is #where #pseudo #class #functional #specificity #javascript

✨ Learn to code for free and get a developer job: https://www.sudipta-deb.in/
✨ Subscribe for new videos on technology every week: https://bit.ly/3vCQKpg

✨Connect with me
📌Twitter:   / thesudiptadeb
📌Website: https://www.sudipta-deb.in/
📌LinkedIn:   / sudiptadeb
📌Facebook:   / technicalpot.  .

Credit: music from www.bensound.com