Change the border color of image and its link

Thu Feb 16, 2012 3:41 pm

In this example the img tag is used as inner one for the link tag, the CSS is used to control the border style.

Code:: <html> <head> <title>Change the image border</title> <style type="text/css"> a:link { background: #fff; display:block; } a:hover img { border-style: dashed; background: #CCC; } img.borderImage { width: 300px; border: 1px dashed blue; background: #fff; padding: 1px; display:block; } </style> </head> <body> <center> <p> In this example we use both the link and the image tag, css is used to control the border style of both, the image and the link . </p> <a href="http://www.codemiles.com"><img class="borderImage" src="site_logo.gif" alt="codemiles" /></a> </center> </body> </html>