how to style links in css code example

Example 1: css link

<link href="main.css" rel="stylesheet">

Example 2: css a link style

a:link { /* unvisited link */ color: #000; text-decoration: none; border: none; }
a:visited { /* visited link */ color: #000; }
a:hover { /* mouse over link */ color: #000; border: none; }
a:active { /* active link */ color: #000; }

Example 3: how to add fanctoin to links in css

<!--the frist one turn it red when your mouse on it 
the 2end one get bigger when your mouse on it 
the 3rd one turn ir backround red when your mouse on it 
the 4th chage litte bit (Idk how to explan it)
the 5th underline the link when your mouse on it -->
<style>
a.ex1:hover, a.ex1:active {color: red;}
a.ex2:hover, a.ex2:active {font-size: 150%;}
a.ex3:hover, a.ex3:active {background: red;}
a.ex4:hover, a.ex4:active {font-family: monospace;}
a.ex5:visited, a.ex5:link {text-decoration: none;}
a.ex5:hover, a.ex5:active {text-decoration: underline;}
</style>

Example 4: css how to style a

/*a normal, unvisited link*/
a:link{
	color: green;
}
/*a link the user has visited*/
a:visited{
	color: purple;
}
/*a link when the user mouses over it*/
a:hover{
	color: yellow;
}
/*a link the moment it is clicked*/
a:active{
	color: brown;
}

Tags: