HTML-Image

In HTML you can insert an image. <img> attribute allow you to add an image.


HTML Image Syntax

<img src="imageurl" >  src attribute in image tag specify path of image.

You can give relative path or absolute path.  You can display the image from other sites too by giving http:// path

Attributes are provided with start tag of HTML element.

Attribute Description Remarks
src Specify path of image  
width Specify width of image Browse will change the width to what is specified here.  However note if you are reducing image width - Search engine will penalize ranking.

So it is better to create small images in advance instead of reducing on the fly.
height Specify height of image Browse will change the height to what is specified here.  However note if you are reducing image height - Search engine will penalize ranking.

So it is better to create small images in advance instead of reducing on the fly.
alt Specify alternate text of image attribute that is displayed if image cant be displated Help in search engine ranking as search engine can determine what this image is about.

 


Sample Code

Link to Webpage

Link to Image

<a id="imghyperlink" href="http://photos.lohri.org/festival/Lohri/Cards/Color%20and%20Light.jpg"><img id="ctl00_ContentPlaceHolder1_RepDetails_ctl01_Image1" alt="image gallery of Color and Light" NavigateUrl="http://photos.lohri.org/festival/Lohri/Cards/Color and Light.jpg" src="http://photos.lohri.org/festival/Lohri/Cards/thumbnails_300/Color%20and%20Light.jpg" border="0" /></a>

<blockquote>

<a id="ctl00_ContentPlaceHolder1_RepDetails_ctl01_hyperlink1" href="http://photos.lohri.org/festival/Lohri/Cards/Color%20and%20Light.jpg">Color and Light</a>

</blockquote>

</p>

Link to Anchor Text in Same Page

<a href="#CSS">Click to see CSS Tips</a>

<h5> <a id="CSS">CSS Tips</a></h5>

Here are tips on CSS</p>

 

Link to send email

This is an email link: <a href="mailto:info@htmll5.com?Subject=Contact">ailto:info@htmll5.com?Subject=Contact us" target="_top">Send Mail to HTMLL5 for help</a></p>

 

 

 

 

 






Attributes    Blocks    Color-Values    Colornames    Colors    Comments    CSS    Editors-for-writing-html    Elements    Entities    Formatting-in-HTML    Forms    Head    Headings    HTML-Reference    IFrames    Image    Javascript    Layouts    Links    Options for building websites    Paragraphs    pointers and questions    Symbol-for-Mathmatics    Symbol-for-Punctuations    Symbols    Tables    Whats-new-in-HTML5   

Advertisement

Topics