*{
background-color:blue;
} graph TD
A:::select
B:::select
C:::select
D:::select
classDef select fill:#1919a6
div{
background-color:blue;
} graph TD
A(div):::select;
B(span );
C(div):::select;
D(span);
classDef select fill:#1919a6;
.box{
background-color:blue;
} graph TD
A(.box):::select;
B(.box):::select;
C(.circle)
D(.triangle);
classDef select fill:#1919a6;
#A{
background-color:blue;
} graph TD
#A
#B
#C
#D
style #A fill:#1919a6;
div p{
background-color:blue;
} graph TD
A(div)-->B(p):::select
A --> C(div) -->F(p):::select
A --> D(btn)
B --> E(p):::select
classDef select fill:#1919a6;
div > p{
background-color:blue;
} graph TD
A(div)-->B(p):::select
A --> C(div) -->F(p)
A --> D(btn)
B --> E(p)
classDef select fill:#1919a6;
div ~ p{
background-color:blue;
} graph TD
A(p)
B(div)
C(p):::select
D(a)
E(p):::select
classDef select fill:#1919a6;
div + p{
background-color:blue;
} graph TD
A(p)
B(div)
C(p):::select
D(a)
E(p)
classDef select fill:#1919a6;
a, div{
background-color:blue;
} graph TD
A(a):::select
B(div):::select
D(a):::select
E(p)
classDef select fill:#1919a6;
<html>
<style>
a.a-color{
color:red;
}
</style>
<!-- Display in red -->
<a class="a-color" href="">I'm Gokul</a>
<!-- No change -->
<p class="p-color">I'm Gokul
</html> graph TD
A(a.class-name):::select
B(p.class-name)
classDef select fill:#1919a6;
p:first-child{
background-color:blue;
} graph TD
A(div)-->B(p):::select
A(div)-->C(p)
A(div)-->D(p)
A(div)-->J(p)
E(div)-->F(a)
E(div)-->G(p)
E(div)-->I(p)
classDef select fill:#1919a6;
p:last-child{
background-color:blue;
} graph TD
A(div)-->B(a)
A(div)-->C(a)
A(div)-->D(p):::select
E(div)-->F(p)
E(div)-->G(p)
E(div)-->I(a)
classDef select fill:#1919a6;
a:only-child{
background-color:blue;
} graph TD
A(div)-->B(a)
A(div)-->C(p)
D(div)-->E(a):::select
classDef select fill:#1919a6;
a:first-of-type{
background-color:blue;
} graph TD
A(div)-->B(p)
A(div)-->C(p)
A(div)-->D(a):::select
A(div)-->E(a)
A(div)-->F(div)-->G(a):::select
F-->H(a)
classDef select fill:#1919a6;
a:last-of-type{
background-color:blue;
} graph TD
A(div)-->B(p)
A(div)-->C(p)
A(div)-->D(a)
A(div)-->E(a):::select
A(div)-->F(div)-->G(a)
F-->H(a):::select
classDef select fill:#1919a6;
p:only-of-type{
background-color:blue;
} graph TD
A(div)-->B(a)
A-->C(p):::select
A-->D(a)
A-->E(div)
E-->F(p)
E-->G(a)
E-->H(p)
classDef select fill:#1919a6;
a:not(.class1) - (Not selector) selects all elements (a) that's not specified inside the not selector
a:not(.class1){
background-color:blue;
} graph TD
A(div)-->B(a):::select
A-->C(p)
A-->D(a.class1)
A-->E(a.class2):::select
classDef select fill:#1919a6;
Thanks. I hope it helps :) any queries do pm @linkeshvaranr