How to remove a:hover attribute link effects for all links containing images

                           In this post , I'm gonna to tutorial on "How to remove a:hover attribute link effects for all links containing images". In css coding of a:link , a:visited , a:hover and a:active attribute general problem arises in image that's cause on hover link show on images. In this article , I'm gonna to → How to resolve this problem in image.

→ First : How to add a link attributes Style on Webpage ?

Links can styled with any CSS Property (example : color , background , font-family , text-decoration etc.). Links can be styled in differently depending on what state they are in and which place are you used (Example: head , body , post , footer etc.).

• a:link - a normal, unvisited link
• a:visited - a link the user has visited
• a:hover - a link when the user mouses over it
• a:active - a link the moment it is clicked

  a styled code example :

a:link {color:#FF0000;} /* unvisited link */a:visited {color:#00FF00;} /* visited link */a:hover {color:#FF00FF;} /* mouse over link */a:active {color:#0000FF;} /* selected link */a:link {background-color:#B2FF99;}
a:visited {background-color:#FFFF85;}a:hover {background-color:#FF704D;}a:active {background-color:#FF704D;}

How to remove Text Decoration:

The text-decoration property is mostly used to remove underlines from links: 

Example→

a:link {text-decoration:none;}a:visited {text-decoration:none;}a:hover {text-decoration:underline;}a:active {text-decoration:underline;}

→ Second: How to remove a:hover attribute link effects for all links containing images ?

If problem with this on image link hover then CSS Style code - Removing :hover attribute for all links containing images. This code add on your css style code  in any plateform use example : Blogger , Wordpress and HTML webpage and solve this problem.

a img {
border: none !important;
display: block;
border-bottom: 0px;
}
a:hover img {
border: none !important;
display: block;
border-bottom: 0px;
}

and also use this code →

a img, :link img, :visited img, {border:none !important; outline:none !important; text-decoration:none !important; }a img {border:none !important; outline:none !important; text-decoration:none !important; }

 Above this code remove underline effects on your webpage.