God I’m funny.
Anytime we have fairly repetitive selectors that have a common parent, it’s probably a place we can use the :is() pseudo-selector.
Holger Bartel demonstrates like this:
section section h1, section article h1, section aside h1, section nav h1,
article section h1, article article h1, article aside h1, article nav h1,
aside section h1, aside article h1, aside aside h1, aside nav h1,
nav section h1, nav article h1, nav aside h1, nav nav h1 {
font-size: 20px;
}Becomes:
:is(section, article, aside, nav)
:is(section, article, aside, nav) h1 {
font-size: 20px;
}Adam Argyle demonstrated like this:
:is() selector ?
the successor to :any() and :matches()sneak peak into our talk, here’s a neat gif I made with XD showing what the :is() selector syntax can do. be excited for Chrome Dev Summit y’all!https://t.co/0r2CcUx9Hv pic.twitter.com/wSuGOsDLvZ
— Adam Argyle (@argyleink) November 7, 2019
MDN has an extra dramatic one:
ol ol ul, ol ul ul, ol menu ul, ol dir ul,
ol ol menu, ol ul menu, ol menu menu, ol dir menu,
ol ol dir, ol ul dir, ol menu dir, ol dir dir,
ul ol ul, ul ul ul, ul menu ul, ul dir ul,
ul ol menu, ul ul menu, ul menu menu, ul dir menu,
ul ol dir, ul ul dir, ul menu dir, ul dir dir,
menu ol ul, menu ul ul, menu menu ul, menu dir ul,
menu ol menu, menu ul menu, menu menu menu, menu dir menu,
menu ol dir, menu ul dir, menu menu dir, menu dir dir,
dir ol ul, dir ul ul, dir menu ul, dir dir ul,
dir ol menu, dir ul menu, dir menu menu, dir dir menu,
dir ol dir, dir ul dir, dir menu dir, dir dir dir {
list-style-type: square;
}:is(ol, ul, menu, dir) :is(ol, ul, menu, dir) ul,
:is(ol, ul, menu, dir) :is(ol, ul, menu, dir) menu,
:is(ol, ul, menu, dir) :is(ol, ul, menu, dir) dir {
list-style-type: square;
}It’s less code and easier to reason.
Kezz Bracey notes that pairing it with :not() can be nice as well:
:not(article, section, aside) :is(h1, h2, h3, h4, h5, h6) {
font-weight: 400;
}Browser support is just starting to get there and polyfilling is hard, so we aren’t at day-to-day no-brainer use levels quite yet. I’d bet it’s not too far away.
27 comments
Hello, this weekend is nice in support of me, for the reason that this moment
i am reading this enormous informative post here at my house.
Heya i’m for the first time here. I found this
board and I in finding It really helpful & it helped
me out much. I am hoping to present something again and aid others like you helped me.
I am extremely impressed with your writing talents as
neatly as with the layout on your weblog. Is this a
paid subject matter or did you customize it your self? Either way stay up the nice quality writing, it’s uncommon to look a nice blog like this one nowadays..
I’ve learn several excellent stuff here. Definitely worth bookmarking for
revisiting. I wonder how much effort you place to make this
kind of excellent informative web site.
Fantastic goods from you, man. I have understand your stuff
previous to and you’re just too great. I really like what you have acquired here,
really like what you are saying and the way in which you say it.
You make it entertaining and you still take care
of to keep it smart. I can’t wait to read much more from you.
This is really a terrific site.
Having read this I believed it was rather enlightening.
I appreciate you finding the time and effort to put this short
article together. I once again find myself spending a significant amount of time both reading and leaving comments.
But so what, it was still worthwhile!
Amazing! Its really awesome piece of writing, I have got
much clear idea about from this article.
Ahaa, its fastidious discussion on the topic of
this post here at this blog, I have read all that,
so now me also commenting at this place.
It’s awesome to visit this web site and reading the views
of all mates about this paragraph, while I am also zealous
of getting know-how.
This article will assist the internet viewers for building up new weblog
or even a weblog from start to end.
I think the admin of this website is really working hard for his web page, since here every stuff is quality based
stuff.
I think this is one of the most important information for me.
And i’m satisfied studying your article. But want to statement on few
basic things, The site style is ideal, the articles is actually excellent : D.
Good process, cheers
Hello everybody, here every one is sharing such familiarity, therefore it’s good
to read this weblog, and I used to go to see this website all
the time.
Here is my web blog; pokerpulsa388.xyz
Excellent beat ! I wish to apprentice while you amend your web site,
how can i subscribe for a blog site? The account helped me a acceptable deal.
I had been tiny bit acquainted of this your broadcast offered bright clear idea
Why viewers still make use of to read news papers when in this technological world all is existing
on web?
whoah this blog is excellent i like reading your articles.
Stay up the good work! You know, a lot of persons are searching
round for this information, you can help them
greatly.
Wow, amazing blog layout! How long have you been blogging for?
you made blogging look easy. The overall look of your web
site is great, as well as the content!
Hello to every one, the contents existing at this web
page are in fact amazing for people experience, well,
keep up the nice work fellows.
That is really fascinating, You’re an overly skilled blogger.
I’ve joined your feed and sit up for looking for more of your wonderful post.
Also, I have shared your site in my social networks
Hello there! I know this is kinda off topic but I was wondering which blog platform are you using for this website?
I’m getting sick and tired of WordPress because I’ve had problems with hackers and I’m looking
at options for another platform. I would be awesome
if you could point me in the direction of a good platform.
I am really thankful to the holder of this site who has shared this
enormous article at here.
Greetings! Very helpful advice within this article!
It’s the little changes that will make the largest changes.
Many thanks for sharing!
I love it when folks come together and share ideas.
Great website, keep it up!
Thanks in favor of sharing such a pleasant opinion, paragraph is pleasant, thats why i have read it completely
This web site really has all the info I needed about this subject and didn’t
know who to ask.
I know this if off topic but I’m looking into starting my own weblog and was wondering what all is needed
to get setup? I’m assuming having a blog like yours would cost a pretty penny?
I’m not very web savvy so I’m not 100% sure. Any
recommendations or advice would be greatly appreciated. Appreciate
it
Hi, I do think your blog might be having browser compatibility
problems. When I take a look at your site in Safari, it looks fine however when opening in IE, it
has some overlapping issues. I just wanted to give you a quick heads up!
Apart from that, fantastic website!