Home / Articles / Programming languages / Markup languages / HTML & CSS / Image as a link in HTML

Image as a link in HTML

Image as a link in HTML
 
Image as a link in HTML
  • Currently 0 out of 5 Stars.
  • 1
  • 2
  • 3
  • 4
  • 5
Rating: 0/5 (0 votes cast)

Thank you for rating!

You have already rated this page, you can only rate it once!

Your rating has been changed, thanks for rating!

Log in or create a user account to rate this page.


In addition to hypertext, you can use images as links. The image in this case must be place between the tags <a href=...> and </a>, as shown in example 1.

Example 1. Creating an image link.

<a href="sample.php"><img src="sample.gif" width="50" height="50"></a>

Parameter href of the a tag specifies the path to the document pointed by the link, and src of the img tag - specifies the path to the image file.

Around an image link one pixel border is automatically added with color matching the color of text links.

sample

To remove the border, in tag img set the parameter border="0" (example 2).

Example 2. Removing border around image links.

<a href="sample.php"><img src="sample.gif" width="50" height="50" border="0"></a>

You can also use CSS, to remove the border for all image links. This is achieved by the style parameter border with parameter value none (example 3).

Example 3. Using CSS.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
  <style type="text/css">
    a img { border: none; }
  </style>
</head>
<body>
  <a href="sample.php"><img src="sample.gif" width="50" height="50"></a>
</body>
</html>

Structure a img defines the context of using styles - only for img tag, which is inside the container a. Therefore, images can then be used as before - with or without border.


 

Read also

Graphics formats in HTML

Graphics formats in HTML

Image size in HTML

Image size in HTML

Inserting images in HTML

Inserting images in HTML

Aligning images in HTML

Aligning images in HTML

Post comment

basicuse.net
html5_css
106160485398655174790

Quick navigation

General navigation