0% found this document useful (0 votes)
73 views6 pages

3011 1635156242052 Practical - 5.2

The document outlines a practical module for a Certificate in Information Technology course, focusing on Internet, Email, and Web Design. It includes several tasks requiring students to write HTML code for creating tables, adding images, and formatting content. Each task provides specific hints and requirements for the desired output in HTML format.
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
73 views6 pages

3011 1635156242052 Practical - 5.2

The document outlines a practical module for a Certificate in Information Technology course, focusing on Internet, Email, and Web Design. It includes several tasks requiring students to write HTML code for creating tables, adding images, and formatting content. Each task provides specific hints and requirements for the desired output in HTML format.
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 6

Course : Certificate in Information Technology

Module Code : Unit_05


Module : Internet, Email & Web Design
A practical is an opportunity for students to test and apply their understanding of the
concepts and ideas introduced in lectures. "Practicals" are called this because they are the
place where the "theoretical" knowledge gained in lectures and readings is put into practice.

Practical (2 Hours)

1) What is the correct order of tags you need to use to create an HTML table?
<table>
<tr>
<th>header 1</th>
<th>header 2</th>
</tr>
<tr>
<td>data 1</td>
<td>data2</td>
</tr>
<tr>
<td>data 3</td>
<td> data 4</td>
</tr>
</table>

2) Write a code segment in HTML to get the following output. (Hint: Heading = H2,
table style="width:100%")

<DOCTYPE html>
<html>
<title>home</title>
<body>
<h2>Basic HTML Table</h2>
<table style=”width:100%”>
<thead>
<th>firstname</th>
<th>lastname</th>
<th>Age</th>

Page 1
</thead>
<tr>
<td>Amal</td>
<td>Danny</td>
<td>John</td>
</tr>
<tr>
<td>Perera</td>
<td>Jackson</td>
<td>Doe</td>
</tr>
<tr>
<td>50</td>
<td>30</td>
<td>35</td>
</tr>
</table>

3) Write a code segment in HTML to get the following output. (Hint: Heading = H2, table, table
heading, table data should have a border of 1px solid black, table style="width:100%)

<html>
<body>
<h2>Bordered Table</h2>
<table border=”1 px solid black” width=”100%”>
<thead>
<th>firstname</th>
<th>lastname</th>
<th>Age</th>
</thead>
<tr>
<td>Amal</td>
<td>Danny</td>
<td>John</td>

Page 2
</tr>
<tr>
<td>Perera</td>
<td>Jackson</td>
<td>Doe</td>
</tr>
<tr>
<td>50</td>
<td>30</td>
<td>35</td>
</tr>
</table>
</body>
</html>

4) Write a code segment in HTML to get the following output. (Hint: Heading = H2, add a suitable
image to display in the browser in jpg format, image width =460px height =345px

Page 3
<html>
<head>
</head>
<body>
<h2>Alternative text</h2>
<img src=” image1.jpg” alt=” street image” width=”460px” height=”345px”>
</body>
</html>

5) Write a code segment in HTML to get the following output.


(Hint: Heading = H2, add image1 to float: right; width:42px; height:42px;”,
Image 2 to float: left; width:42px; height:42px;"

<!DOCTYPE html>
<html>
<head>
<title>home</title>
</head>
<body>
<h2>Floating Images</h2>
<p>Float the image to the right:<br>
A paragraph with a floating image. A paragraph with a floating image. A
paragraph with a floating image. </p>
<marquee direction=” right”><img src=” image1.png” width=”42px”
height=”42px”></marquee>
<br>
<p>Float the image to the left:<br>
A paragraph with a floating image. A paragraph with a floating image. A paragraph
with a floating image. </p>
<marquee direction=” left”><img src=” image1.png” width=”42px”
height=”42px”></marquee>
</body>
</html>

Page 4
6) Create the following output using HTML
Name Age Telephone
Nimal 16 0771234567
Lihini 15 0711234567
Gopi 17 0761234567
Rahuman 16 0781234567
Shuqra 15 0771234567
Student Details

<html>
<head>
<title>home</title>
</head>
<body>
<table border=”1” width=”100%” height=”50px”>
<thead>
<th>name</th>
<th>age</th>
<th>telephone</th>
</thead>
<tbody>
<tr>
<td>nimal</td>
<td>lihini</td>
<td>Gopi</td>
<td>Rahuman</td>
<td>Shuqra</d>
</tr>
<tr>
<td>16</td>
<td>15</td>
<td>17</td>
<td>16</td>
<td>15</td>
</tr>
<tr>
<td>0771234567</td>
<td>0711234567</td>
<td>0761234567</td>
<td>0781234567</td>
<td>0771234567</td>
</tr>
</tbody>
<tfoot>
<td>student details</td>
</tfoot>
</table>
</body>
</html>

Page 5
Page 6

You might also like

pFad - Phonifier reborn

Pfad - The Proxy pFad of © 2024 Garber Painting. All rights reserved.

Note: This service is not intended for secure transactions such as banking, social media, email, or purchasing. Use at your own risk. We assume no liability whatsoever for broken pages.


Alternative Proxies:

Alternative Proxy

pFad Proxy

pFad v3 Proxy

pFad v4 Proxy