If you are not yet familiar with the rollover images, try reading ROLLOVER IMAGES USING CSS first. Now, why can't you just add a link to the div like <a><div></div></a>, the answer is that, this code would be against the proper markup in writing HTML documents. Div tags are not supposed to be wrapped by anchor tags, though if you would try, there is a great chance of success. But this topic is about writing the valid markup for the rollover images with a link. Remember, this only applies to the approach I made in creating rollover images and those alike.
The easiest way to get through this is by putting the anchor tag within the div tag like this <div><a></a></div>, a CSS will be needed in order to give the anchor tag the height and the width. So here is a step by step procedure in structuring the link.
1 Create your rollover image. If you do not know how to do so yet, read this post.
2 Add the anchor tags within the div tags like this <div><a href="URL"></a></div>
3 Replace the URL with your desired link. e.g. http://google.com
4 Add this line style="height: 100%; width: 100%; display: block;" within the anchor tag.
You should end up with something like this <div id="RolloversID"><a style="height: 100%; width: 100%; display: block;" href="URL"></a></div>
No comments:
Post a Comment