Page 83 - modular_v2.0_HTML&_CSS_Fb
P. 83

7                                                       IMAGES, LINKS AND


                                                                                  FRAMES IN HTML










                                    Your Aim

                                    to learn about:
                                        l    Inserting images             l    Linking Web Pages
                                         l    Frames




                 The websites we generally visit have lots of images as part of the web page. We have also noticed
                 that all the web pages are linked to each other. Sometimes, we see that a web page is divided
                 into various sections. HTML allows us to implement all these functionalities in our web pages. In
                 this chapter, we will learn about inserting images, linking web pages, and framing the content.

                    INSERTING IMAGES

                 Images and other graphical elements such as drawings, paintings and charts enhance the look
                 and feel of a web page. All these graphical elements are considered image in the web page.
                 HTML also allows us to insert images inside the web pages through the <IMG> tag. The <IMG>
                 tag is a container tag and has various attributes.
                 The attributes of the <IMG> tag are:

                      SRC: It specifies the source or URL of the image that has to be inserted in the web page. For
                      example,
                      <IMG SRC="C:/Mydocuments/rose.jpeg"/>
                      WIDTH: It specifies the width of the image in the web page. For example,

                      <IMG SRC="rose.jpeg" WIDTH="50%"/>
                      HEIGHT: It specifies the height of the image in the web page. For example,

                      <IMG SRC="rose.jpeg" HEIGHT="60%"/>
                      TITLE: It provides additional information about the image in a tooltip on hover.
                      ALT: It specifies the alternate text to be displayed in the web browser, if the provided image

                      is not found. For example,
                      <IMG SRC="rose.jpeg" ALT="Describing the flower"/>
                 Let us use the <IMG> tag to insert an image on the web page in the following way:

                 <!DOCTYPE HTML>
                 <HTML>
                                                                                                                81
                                                                              Images, Links and Frames in HTML
   78   79   80   81   82   83   84   85   86   87   88