How to make <img style> clickable

Question

I am using the following code:

<img style="border:2px solid #3591c0;
width:200;
height:200;
border-radius-30px;
-moz-border-radius:30px;
-khtml-border-radius:30px;
-webkit-border-radius:30px;"
src="1.jpg"/></style>

How can I make the image in this code clickable?

Answer 1

You could put it in an anchor <a> tag, which would make it a link.

<a>
    <img style="border:2px solid #3591c0;
    width:200;
    height:200;
    border-radius-30px;
    -moz-border-radius:30px;
    -khtml-border-radius:30px;
    -webkit-border-radius:30px;"
    src="1.jpg"/>
</a>

Answer 2

Wrap that <img> tage within an <a> tag. In addition, </style> is not needed.

<a href="http://stackoverflow.com">
  <img style="border:2px solid #3591c0;
  width:200;
  height:200;
  border-radius-30px;
  -moz-border-radius:30px;
  -khtml-border-radius:30px;
  -webkit-border-radius:30px;"
  src="1.jpg"/>
</a>

Answer 3

Surround it in an anchor tag:

<a href="destination.html">
    <img style="border:2px solid #3591c0;
    width:200;
    height:200;
    border-radius-30px;
    -moz-border-radius:30px;
    -khtml-border-radius:30px;
    -webkit-border-radius:30px;"
    src="1.jpg"/>
</a>

where "destination.html" is the file path or link where you want the user to be redirected to. And yes, you don't need the </style> tag.

This is all shown in the JSFiddle: http://jsfiddle.net/Mf6Dq/5/