logo

India's First Software Developer Community

Hover Effect

Learn how to give hover effect in css.

We are applying hover effect to anchor tag which is used to connect pages or Images in webpage

You can cut this css code and paste it in external stylesheet too.


<!DOCTYPE html>
<html>
<head>
<title> hover Effect| W3CodeIndia </title>
<style type="text/css">
a
{
text-decoration:none; /* used for removing underline */
display:block; /* Creating Block element */
width:150px; /* width of block */
height:20px; /* height of block */
color:#fff;
background:#000;
font-size:20px; /* font size of text */
}
a:hover
{
text-decoration:none; /* used for removing underline */
display:block; /* Creating Block element */
width:200px; /* width of block */
height:30px; /* height of block */
color:#000;
background:#ff0;
font-size:30px; /* font size of text */
}
</style>
</head>
<body>
<center><h2>Hover Effect in CSS | W3CodeIndia</h2></center>
<center><a href="http://www.w3codeindia.com">W3CodeIndia</a></center>
</body>
</html>




Subscribe Us :

Chapters :-


Advertisement