Friday 6 September 2013

How to Add Image to Your Web Page Using HTML?

It is easy to add image to your web page using HTML. You can insert any image using your PC and or can insert images from different locations. If you wish to insert image in your computer you need to make some folder structure. That is not compulsory but it make clear path of image inserting.
When you start with creating web page, first make main folder name called index or my web. Inside such folder make sub folder name called image.

Example:-

Copy and paste all images to image folder and check easy path of image located with. We use <img> tag to import images on web page with “src”  attribute. The meaning of “src” is source and it mentioned the value of URL that image already stored. It is one of the empty tag, which no need to close.

Example:- (Click on images to enlarge)


Document Output


Other attributes with HTML <img> tag.
"ALT"
Here ALT mentioned alternate text for an image and while unable to load image. It is a one of alternative way of display additional information on image by author generated. When you move your mouse pointer over the image alternative text will display as additional information.

Example:-
<img src="image/lio.jpg" width="630" height="300" alt="We are Lions"></p>

"width"/"height"
Both of width and height attributes are used to mention the height and width of inserted image.

"align"
Use to align an inserted image within the text.

<img src="baby.gif" alt="Sweet Baby" align="middle" width="100" height="75">
If you wish to insert image from any other location like internet you have to mentioned URL of image clearly. Otherwise you will not be able show the image.

<img src="http://yourwebdevelopment-helpz.blogspot.com/images/hplaptop.jpg" alt="Laptop" width="100" height="150"> 

No comments:

Post a Comment

2022 OL මාර්ගගත ප්‍ර්‍රශ්න පත්‍ර්‍ර්‍ර එකතුව

ණැන පියස අ.පො.ස සාමාන්‍ය පෙළ විභාගයේ පසුගිය ප්‍රශ්න පත්‍රවල කෙටි ප්‍රශ්න- මාර්ගගත පුනරීක්ෂණ අභ්‍යාස මාලාව