css pseudo classes

1.element:nth-child(1)
2.element:hover
3.element:visited

1The syntax of pseudo-classes:
2
3selector:pseudo-class {
4  	property:value;
5}

1button:hover {
2  color: blue;
3}
4
5A pseudo-class is a word such as :hover that makes its changes
6to the selected element by adding it along side the selector 
7before the curly braces in CSS instead of inside the curly 
8braces.
9
10You can search for a list of pseudo-class online.
11
12

1 /* unvisited link */
2a:link {
3  color: #FF0000;
4}
5
6/* visited 
7link */
8a:visited {
9  color: #00FF00;
10}
11
12/* mouse over link */
13
14a:hover {
15  color: #FF00FF;
16}
17
18/* selected link */
19a:active {
20
21  color: #0000FF;
22}

1a:link{
2  color: blue;
3}
4a:visited{
5  color: purple;
6}
7a:hover{
8  color: red;
9}
10a:active{
11  color: green;
12}
13
14
15p:first-child{
16  background: #05ffb0;
17  border: 1px solid;
18  padding: 5px;
19}
20
21p:last-child{
22  background: #05ffb0;
23  border: 1px solid;
24  padding: 5px;
25}
26
27p:nth-child(3){
28  background: #05ffb0;
29  border: 1px solid;
30  padding: 5px;
31}
32
33p:nth-child(2n+1){
34  background: #05ffb0;
35  border: 1px solid;
36  padding: 5px;
37}

1button/anchor:hover / :active / :checked
2:nth-of-type(3) // select the third element
3:nth-of-type(3n) // select an element every three