• HTML
  • React
  • Knowledge Base
  • HTML
  • React
  • Knowledge Base
  • HTML Tutorial
  • HTML Styles – CSS
  • Link to an Email Address
  • HTML Introduction
  • HTML Editors
  • HTML Basic Examples
  • HTML Elements
  • HTML Attributes
  • HTML Headings
  • HTML Paragraphs
  • HTML Styles
  • HTML Text Formatting
  • HTML Quotation and Citation Elements
  • HTML Comments
  • HTML Colors
  • HTML RGB and RGBA Colors
  • HTML HEX Colors
  • HTML HSL and HSLA Colors
  • CSS Colors, Fonts and Sizes
  • CSS Padding
  • CSS Border
  • CSS Margin
  • Link to External CSS
  • HTML Style Tags
  • HTML Links
  • HTML Links – The target Attribute
  • Absolute URLs vs. Relative URLs
  • HTML Links – Use an Image as a Link
  • Button as a Link
  • Link Titles
  • Absolute URLs and Relative URLs
  • HTML Link Tags
  • HTML Links – Different Colors
  • Link Buttons
  • HTML Links – Create Bookmarks
  • The alt Attribute
  • HTML Images
  • Image Size – Width and Height
  • Image Width and Height, or Style
  • Images in Another Folder
  • HTML Images on Another Server/Website
  • HTML Animated Images
  • Image as a Link
  • Image Floating
  • Common Image Formats
  • HTML Image Tags
  • The render Method

Image as a Link

4 views 0

Written by admin
April 15, 2023

You can use an image as a link in HTML by wrapping the <img> tag with an <a> tag. This allows the user to click on the image and be redirected to a different page or location.

Here is an example of how to create an image link:

<a href="https://www.example.com">
  <img src="example.jpg" alt="Example Image">
</a>

In this example, the image is wrapped in an anchor tag (<a>) with the href attribute set to the destination URL. When the user clicks on the image, the browser will navigate to the URL specified in the href attribute.

You can style the image link using CSS, just like any other HTML element. For example, you can add a border around the image to make it more prominent, like this:

<a href="https://www.example.com">
  <img src="example.jpg" alt="Example Image" style="border: 2px solid red;">
</a>

In this example, the style attribute is used to apply a 2-pixel solid red border around the image.

Was this helpful?

Yes  No
Related Articles
  • The render Method
  • HTML Image Tags
  • Common Image Formats
  • Image Floating
  • HTML Animated Images
  • HTML Images on Another Server/Website

Didn't find your answer? Contact Us

Leave A Comment Cancel reply

Previously
HTML Animated Images
Up Next
Image Floating
Copyright 2022 k-window. All Rights Reserved