CSS Basics (Part5) - Advanced Selectors 

Today we look at some advanced selectors.
A lot of what we cover is building upon the previous two videos where we discus basic selectors, and then properties and values. If you need too, check those out now:
Basic Selectors: • CSS Basics (Part3) - S...
Properties and Values: • CSS Basics (Part4) - P...
=========================
Basic Selectors
tag | a
class | .container
id | #main-list
========================
Selector stacking
a, strong {
color: red;
}
========================
All Selector
* {
margin: 0;
}
========================
Descendant Selector
li a {
color: red;
}
li li a {
color: red;
}
========================
Direct Descendant Selector
( youtube doesn't allow brackets in the description. )
.container (greater-than) ul {
border: 4px solid red;
}
========================
Adjacent Selector
ul + p {
color: red;
}
========================
Sibling Combinator
ul ~ p {
color: red;
}
========================
Pseudo Classes
a:hover { text-decoration: none; }
textarea:focus {border-color: blue}
========================
Put it together...
.peeka:hover + .boo {
display: block;
}
========================
nth selector
p:first-child
p:last-of-type
p:nth-child(3)
p:nth-child(odd)
p:nth-child(3n)
YAY!!!!!