html - CSS * selector but exclude a particular tag -

background

so found line of code in our ext js's css removes focus every element in webkit. unfortunately has been 2 years , still haven't addressed todo.

    // todo: remove outline individual components need instead of resetting globally .#{$prefix}webkit {     * {         &:focus {             outline:none !important;         }     } } 

which compiles

.x-webkit *:focus {   outline: none !important; } 

what take away browsers default focus (ua styles) on links when user tabs anchor tag have no ui indication on tag. want use native browser behavior don't want override a:focus in particular , using initial doesn't work. removing entire style causes ui components handle focus ui differently not acceptable.

tldr

what best approach applying style tags except tag(s). know can make selector has of tags except tag don't want tedious, best approach ? if there list of valid ui tags html ?

you use css :not selector, , apply style descendants of .x-webkit except tag(s) want exclude:

.x-webkit *:not(p):not(em) {    color: red;  }

<div class="x-webkit">    <div>red</div>    <ul><li>red</li></ul>    <p>      not red<br>      <strong>red</strong><br>      <em>not red</em>    </p>    <table><tr><td>red</td></tr></table>  </div>