Home | HTML | Asp.Net | HTML Probe | .Net Probe
   
 www.solvingera.com 
  Contact Us |Sitemap
  
 
 

Image in HTML

 Skip Navigation LinksHome>Html Home>HTML Image

<img /> element is used to add an image to a webpage.It is an empty element.

NOTE- An empty element has only one tag, with neither a distinct opening nor closing tag.

Example:

<img src="abc009.png" />

NOTE: The src attribute specifies the location of the image you want to display on your page.

Adding alternative text to an image

Alternative text describes the unopened image in the browswe. Alternative text helps the visitors to get a former information about the image.

Example:

<p><img src="abc001.jpg" alt="alternative name" /> Description</p>

Image size,border,alignment & image spacing

  • height and width attributes with the <img /> element is used to adjust the height and width of an image (in pixels).

  • border attribute is used to set the border of an image.

  • align attribute with the <img /> element to control how image appears relative to the text around it.

    • top: Aligns the text around the image with the top of the image.

    • middle: Aligns the text around the image with the middle of the image.

    • bottom: Aligns the text around the image with the bottom of the image.

    • left: The image sits on the left, and text floats to the right of the image.

    • right: The image sits on the right, and text floats to the left of the image.

  • vspace (vertical space) attribute is used for top and bottom space.

  • The hspace (horizontal space) attribute is used for left and right space.
    The default value for hspace and vspace is 1.

Example:

  1. Image Size:

     <p>
      <img src="ImageName.jpg" width="50" height="70" alt="rainbow"/>description
     </p>
  2. image border

    <p>
      <img src="ImageName.jpg" width="50" height="70"alt="rainbow" border="10"/>description
    </p>

  3. Image alignment

    <p>
     <img src="ImageName.jpg" width="50" height="70" alt="rainbow" border="10" align="middle"/>image will display in center.
    </p>

  4. Image spacing

    <p>
    <img src="ImageName.jpg" width="50" height="70" alt="rainbow" border="10" hspace="20" vspace="25"/>horizontal space is 20px & vertical space is 25px.
    </p>

Link Image

Link image is used to open other location after clicking a image.

Example:

<a href="http://www.solvingera.com"> <img src="solvingeraImage.jpg" alt="Visit the solvingera Web Site" height="50" width="300" border="1"  /></a>


  
   
  
DMCA.com Protection Status
Design & Maintain By solvingera group| solvingera.com © 2013-2014 | all right reserved |Privacy Policy | Back to top