How to Convert an Image to HTML Code

Techwalla may earn compensation through affiliate links in this story. Learn more about our affiliate and product review process here.
A man's hands on a computer keyboard
Image Credit: JatinderKumar/iStock/Getty Images

With just a few snippets of HTML code, you can embed an image into any web page, email or other Internet-based HTML or XML document. While you cannot "convert" an image to HTML code, you can save the image locally or at a specific Web address and then designate a place for it in an HTML document. You can also specify how many pixels large the the image should appear, both vertically and horizontally. Read on to learn how to convert an image to HTML code.

Advertisement

Step 1

Choose an image. It can be any image of any size.

Video of the Day

Step 2

Save the image locally or online. This means that you can save it to your computer or at a specific Web address. If you want other people to be able to see the image online, you need to upload the image to a Web server. Use your website server, or if you have no website, try using Picasa or other image storage and sharing application. Take note of the URL where the photo is saved.

Advertisement

Step 3

Open an HTML document. Use the image tag and the exact URL of where the image is stored: . This will embed the image into your HTML document. When the user opens that document via a Web browser or other program, the image will appear.

Step 4

Adjust the width of the image as you wish it to appear, in terms of pixels. Again, use the exact URL of where the image is stored. For example, <img src-"http://example.com/image.jpg" width=400>. This will stretch or shrink the existing width of the image to 400 pixels.

Advertisement

Advertisement

Step 5

Adjust the height of the image as you wish it to appear, in terms of pixels. For example, . This will stretch or shrink the existing height of the image to 700 pixels.

Step 6

Combine width and height adjustments as necessary. For example, .

Step 7

Turn the image into a link if desired. Use the anchor tag with the image tag embedded within. For example, .

Video of the Day

Advertisement

Advertisement

Report an Issue

screenshot of the current page

Screenshot loading...