pseudo class

hover state can be used on any element on our document.

div:hover{
height:5em;
width:5em;
background-color:pink;

}

so it will change color when u hover

focus
a:focus {
font-size:2em;
color:green;
}

on focus, our hyperlink is going to change - click on it will change or when i tab to it.

first child.

li {
color:green;
}

li:first-child {
font-size:2em;
color:pink;
}
the first child has become pink with 2em
will only match if its the first element of the parent element

lang

:lang (sp) {
color:orange
font-weight:bold;
}

so where the is spanish content, format with these properties in the declaration

not all browsers support the following yet

p:last-child {
color:red;
}

p:only-child {
color:red
}
so where there is an only child of it's parent, it will turn red

first of type
p:first-of-type {
font-family:verdana;
color:red;
}
first of its type in the p element will format in in red