Image Codes

This page contains image codes. Feel free to copy and paste the image codes into your own website, blog, MySpace page, or other HTML document. And feel free to modify the code as you wish.

Also, please consider keeping the link back to this website - if you do it will be very much appreciated!

HTML and CSS provides many different image codes to add images to web pages.

This page explains the basic HTML image codes as well as the basic background image codes. There are also links to pages that provide more specific image-related code.

Basic HTML Image Code

To embed an image into a web page, you need to use the HTML img tag. This tag allows you to specify the location of your image, its dimensions, as well as other attributes.

Here's a code example of a basic image:

Source Code	Result
<!-- Codes by HTMLcodes.me --> <img src="http://www.htmlcodes.me/images/image-codes/city-skyline.gif" width="150" height="106" alt="Cartoon drawing of city skyline" /> <p><a style="font-size:11px;color:#999;" href="http://www.htmlcodes.me/image-codes/">HTML Image Codes</a></p>

Background Images

You can create a background image so that other HTML elements appear in front of the image. To do this, you use the CSS background-image property.

Example:

Source Code

Result

<!-- Codes by HTMLcodes.me -->
            <div style="width:300px;height:106px;background-image:url(http://www.htmlcodes.me/images/backgrounds/background-image-2.gif)">
            This 'div' tag has a background image that repeats. See <a href="http://www.htmlcodes.me/backgrounds/html-background-image.cfm">HTML background image</a> for non-repeating background images.
            </div>
            <p><a  style="font-size:11px;color:#999;" href="http://www.htmlcodes.me/image-codes/">HTML Image Codes</a></p>

This 'div' tag has a background image that repeats. See HTML background image for non-repeating background images.

More Image Codes

You can do a lot using HTML and CSS image codes. Below are some specific examples: