Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Matching multiple pseudo classes

Tags:

css

I want to know is there a way to doing something like this in CSS:

.menu a:match(:active:hover:visited)
{ }

instead of

.menu a, .menu a:active, .menu a:hover, .menu a:visited
{ }
like image 232
timu Avatar asked Jul 15 '26 09:07

timu


2 Answers

If your a have same color for all states so, it's better write like this:

.menu a{
 color:red;
}

instead of

.menu a, .menu a:active, .menu a:hover, .menu a:visited{color:red}
like image 118
sandeep Avatar answered Jul 21 '26 13:07

sandeep


No. There is currently no mechanism to do what you want. You need to list all the selectors in full, as per what you are trying to avoid:

.menu a, .menu a:active, .menu a:hover, .menu a:visited

CSS is currently more like a markup language than a programming language. As Litek notes in the comments, however, :matches:() proposed for CSS4 does exactly what you described (and more).

like image 22
Duncan Babbage Avatar answered Jul 21 '26 13:07

Duncan Babbage



Donate For Us

If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!