Scribd
Upload
4 views

lab program answers

The document contains three separate HTML examples: a table displaying food categories and their corresponding weights for meals, an order form for light bulbs with user input fields and payment options, and a JavaScript code that generates a table showing the squares and cubes of numbers from 0 to 10. Each section is well-structured with appropriate HTML elements. The examples demonstrate basic HTML table creation, form handling, and JavaScript for dynamic content generation.

Uploaded by

alagesana321
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
4 views

lab program answers

The document contains three separate HTML examples: a table displaying food categories and their corresponding weights for meals, an order form for light bulbs with user input fields and payment options, and a JavaScript code that generates a table showing the squares and cubes of numbers from 0 to 10. Each section is well-structured with appropriate HTML elements. The examples demonstrate basic HTML table creation, form handling, and JavaScript for dynamic content generation.

Uploaded by

alagesana321
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
You are on page 1/ 4

Create HTML document that defines a table with two levels of column labels: an overall

label,“Meals”, and three secondary labels, “Breakfast”, “Lunch”, and “Dinner”. There
must be two levels of row labels: an overall label, “Foods”, and four secondary labels,
“Bread”, “Main Course”,“Vegetable” and “Dessert”. The cells of the table must contain a
number of grams for each of the food categories.
<html>
<head>
<title>Two-Level Table</title>
</head>
<body>
<h1>Foods and Meals Table</h1>
<table border=1>
<thead>
<tr>
<th rowspan="2">Foods</th>
<th colspan="3">Meals</th>
</tr>
<tr>
<th>Breakfast</th>
<th>Lunch</th>
<th>Dinner</th>
</tr>
</thead>
<tbody>
<tr>
<th>Bread</th>
<td>50g</td>
<td>60g</td>
<td>40g</td>
</tr>
<tr>
<th>Main Course</th>
<td>100g</td>
<td>150g</td>
<td>120g</td>
</tr>
<tr>
<th>Vegetable</th>
<td>70g</td>
<td>80g</td>
<td>90g</td>
</tr>
<tr>
<th>Dessert</th>
<td>30g</td>
<td>50g</td>
<td>40g</td>
</tr>
</tbody>
</table>
</body>
</html>

i.Create document that has a form with the following controls:


a. A text box to collect the user’s name
b. Four checkboxes, one each for the following items:
i. Four 100-watt light bulbs for $2.39
ii. Eight 100-watt light bulbs for $4.29
iii. Four 100-watt, long-life light bulbs for $3.95
iv. Eight 100-watt, long-life light bulbs for $7.49
c. A collection of three radio buttons that are labeled as follows:
i. Visa
ii. Master Card
iii. Discover

<html>
<head>
<title>Light Bulbs Order Form</title>
</head>
<body>
<h1>Order Form</h1>
<form>
<label>Name:</label><br>
<input type="text" id="name" name="name"><br>
<label>Choose your light bulbs:</label><br>
<input type="checkbox" id="option1" name="bulbs" value="2.39">
<label>Four 100-watt light bulbs for $2.39</label><br>

<input type="checkbox" id="option2" name="bulbs" value="4.29">


<label>Eight 100-watt light bulbs for $4.29</label><br>
<input type="checkbox" id="option3" name="bulbs" value="3.95">
<label>Four 100-watt, long-life light bulbs for $3.95</label><br>

<input type="checkbox" id="option4" name="bulbs" value="7.49">


<label>Eight 100-watt, long-life light bulbs for $7.49</label>
<br>
<label>Payment Method:</label><br>
<input type="radio" id="visa" name="payment" value="Visa">
<label>Visa</label><br>

<input type="radio" id="mastercard" name="payment" value="MasterCard">


<label>Master Card</label><br>

<input type="radio" id="discover" name="payment" value="Discover">


<label>Discover</label><br>
<button type="submit">Submit Order</button>
</form>
</body>
</html>

Write a JavaScript that calculates the squares and cubes of the numbers from 0 to 10 and
outputs HTML text that displays the resulting values in an HTML table format.
<html>
<head>
<title>Square and Qube of Number</title>
</head>
<body>
<table border="1">
<tr>
<th>Number</th>
<th>Square</th>
<th>Cube</th>
</tr>
<script language="javascript">
for(a=0;a<=10;a++)
{
document.write("<tr><td>"+a+"</td><td>"+(a*a)
+"</td><td>"+(a*a*a)+"</td></tr>");
}
</script>
</body>
</html>

You might also like