Page 63 - Code & Click - 8
P. 63

Experiential Learning
              Lab Activity 5
             To display two web pages within a same browser window.

              1.  Open Notepad and create the HTML document as shown below.

                <!DOCTYPE html>                                  <!DOCTYPE html>
                <html>                                           <html>
                <head> <title> Computer Software </title> </head>   <head> <title> Types of Software </title> </head>
                                                                 <style type=“text/css”>
                <style type=“text/css”>                          h1 {color: Red; text-align: center; font-size: 30px}
                h1 {color: Blue; text-align: center; font-size: 40px}  p {color: blue; text-align: left; font-size: 25px}
                p {color: green; text-align: left; font-size: 25px}  li {color: green; font-size: 20px}
                </style>                                         </style>
                                                                 <body>
                <body>                                           <h1> Types of Software </h1>
                <h1> Computer Software </h1>                     <p> <b> Software can be divided into the following
                <p> <b> All hardware requires instructions to perform   categories: <b> </p>
                its tasks. These instructions are called programs   <ol>
                or Software. Software is written in one of severeal       <li> <b> System Software </b> </li>
                                                                     <ul> <li> Operating System </li>
                programming languages. </p>                               <li> Utility Software </li>
                <p> <b> Software is of different types, depending on its            <li> Language Processors </li>
                purpose and scope of functionality. </b> </p>        </ul>
                </body>                                              <li> <b> Application Software </b> </li>
                                                                     <ul> <li> General-purpose Application Software </li>
                </html>                                                     <li> Customised Application Software </li>
                                                                          <li> Language Processors </li>
                                                                     </ul>
                                                                 </ol>
                                                                 </body>
                                                                 </html>
             Save the first document with the name ‘ComputerSoftware.html’ and the second document with
             the name ‘Types of Software.html’.
             Create the third HTML document as shown below and save it with the name ‘Frames in HTML.html’.
             Open the document named ‘Frames in HTML.html’ in Microsoft Edge.


                 <!DOCTYPE html>                                      2.  Open the HTML document in Microsoft
                 <html>                                                   Edge.
                 <head> <title> Frames in HTML </title> </head>
                 <style type= “text/css”>
                 h1 {color: brown; font-family: Calibri; text-align:
                 center; font-size: 40px; text-transform: uppercase;
                 font-decoration: underline}
                 </style>
                 <body>
                 <h1> Frames in HTML </h1>
                 <iframe src=“ComputerSoftware.html” width=500
                 height=400> </iframe>
                 <iframe src=“Types of Software.html” width=500
                 height=400>
                 </iframe>
                 </body>
                 </html>



             Database                                                                            Subject Enrichment
             The <embed> tag defines a container for an external resource, such as a web page, a picture, a media player,
             or a plug-in application, to be inserted on a web page. It takes four attributes:
             • src: specifies the path of the resource                 • type: specifies the type of resource
             • height: height of the resource displayed on the web page
             • width: width of the resource displayed on the web page.



                                                                                                                 61
   58   59   60   61   62   63   64   65   66   67   68