Inserting Images in HTML - Technology & Web designing

Breaking

Thursday, 30 April 2020

Inserting Images in HTML

Image Formats :

  • Animated GIF : GIF (pronounced as jiffy) is a file that move or less includes a bunch of images stacked together to give the illusion of movement. Animated GIFs are similar to those little cartoon booklets you had as a kid. The uses of GIF for flashing commercial messages to elaborate mini movies to small bullets or arrows that appears to grow or move.
  • JPG/JPEG : JPG (pronounced jay-peg) acronym Joint Photographic Experts Group is most popular images on the web because it support millions of color and they are much smaller in size, easy to download.
  • PNG : PNG (pronounced as ping) acronym Protable Network Graphics is newly file formate used in most browser. It supports millions of colours and uses loosless compression technique.
  • BMP : BMP acronym Bitmap Picture can be made using window paint software.

Inserting images in documents :

Inserting images in document in two ways :

  1. Use image as floating (inline) image.
  2. Use as background image

The <IMG> Tag :

The <IMG> tag is used to place an inline image in a document.

Attribute :

  • SRC : This defines the name of the image file. If the file in the same folder as of HTML document, then only the filename is to be specified otherwise the complete path or URL.
  • Height & Width : These two attributes specify the height and the width of the image. The value can be specified in Pixel or Percentage.
  • Border : This specifies the border of the image.
  • HSPACE & VSPACE : This specifies how much blank space in pixels.
  • Align : This attribute decribes how the image should be aligned with respect to the surrounding text. Values are top, bottom, centre/middle, left & right.
  • LOWSRC : This attribute indicate the absolute or relative location of a low resolution version of an image.
  • ALT : The value of this attribute should be some text describing the image. This message will be displayed where the image will be placed until it is download & also as a tool tip text.

E.g. <Img SRC="com.jpg" ALT="Computer">

Programe :

Use image as Floating :

E.g. <IMG SRC ="c:\window\image\left.gif" ALT ="Display text" ALIGN ="centre" BORDER ="2" Width ="50" Height ="50" Name ="left>

Use Images as Links :

E.g. <A HREF ="http://www.news.com"><IMG SRC ="/Picture/images/left.gif ALT ="Display text" ALIGN ="centre" BORDER ="2" Width ="50" Height ="50" Name ="left></A>

Use Images as background :

<Body Background ="/picture/Images/left.gif">

No comments:

Post a Comment

If you have any doubts regarding this please comment or email us.