Page 73 - Computer - 8
P. 73

Knowledge Discovery                                                             Subject Enrichment


                The images used in a web page must be stored in the same folder as the HTML document that describes
                the page. In case you want to use an image from another folder, specify the full path of the location of the
                image file on the computer. For example, if the image Flower.png is stored in a folder Pictures on C: drive,
                the image tag will be <img src= “C:\Pictures\Flower.png”>.


            Lab Activity 8
                                                                                                   Experiential Learning
           To display a web page with images.
            1.  Open Notepad and create the HTML document as shown below.


                 <!DOCTYPE html>                                  2.  Open the HTML document in Microsoft Edge.
                 <html>
                 <head> <title> Planets in Solar System </title> </
                 head>
                 <style type = “text/css”>
                 img {border: 3px solid blue; width: 200px; height:
                 200px}
                 h3 {color: blue; text-align: center; font-size:
                 40px}
                 p {color: green; font-family: Calibri; font-size:
                 25px}
                 </style>
                 <body>
                 <h3> The Planets </h3>
                 <p> A planet is a large, rounded astronomical body
                 made of rocks and gases. The Solar System has eight
                 planets: Mercury, Venus, Earth, Mars, Jupiter,
                 Saturn, Uranus, and Neptune. </p>
                 <p> The first four planets are made of rocks and are
                 called Terrestrial planets. </p>
                 <img src=“Mercury1.jpg” alt=“Planet Mercury”>
                 <img src=“Venus.jpg” alt=“Planet Venus”>
                 <br>
                 <img src=“Earth.jpg” alt=“Planet Earth”>
                 <img src=“Mars.jpg” alt=“Planet Mars”>
                 </body>
                 </html>



                   Try This
                                                                                                   Computational Skills
             Create an HTML document to display a web page as given in the images.
             (a)                                    (b)


















                                                                                                              71
   68   69   70   71   72   73   74   75   76   77   78