Sunday, 5 February 2017

HTML and CSS Basic Assignment 6

Create, test and validate a CSS document that defines a table that has two levels of column labels an overall label meal and three secondary labels- breakfast, lunch, dinner. There must be two levels of row levels an overall label food and four secondary labels- bread, main course, vegetables and desert. The cells of the table must contain a number of groups for each of the food categories.

<!DOCTYPE html>
<html>
<head>
<title>food chart</title>
<style type="text/css">
table{border-width: Medium;
          border-color: green;
          border-bottom-style: double;
          border-top-style: double;
          border-right-style:dotted;
          border-left-style:dotted;
        }
p{border-style:double;
    border-width:thick;
    border-color:blue;
    margin:0.3in;
    padding:0.1in;
    font-weight:lighter;
    f ont-family:fantasy;
    font-size:16pt;
   text-indent:5.9in
}
font{font-weight:bolder;font-size:20pt;font-family:monospace;}
</style>
</head>
<body>
<table border="5" cellpadding="30" cellspacing="10" align="center">
<caption><font>Daily Nutrition</font></caption>
<tr>
<th colspan="6">MEALS</th>
</tr>
<tr>
<th colspan="2"></th>
<th>Breakfast</th>
<th>Lunch</th>
<th>Dinner</th>
</tr>
<tr>
<th rowspan="4">FOOD</th>
<th>Bread</th>
<td>3 slices</td>
<td>2 slices</td>
<td>1 slices</td>
</tr>
<tr>
<th>Main Course</th>
<td>1 chapati</td>
<td>curd rice: 50gms</td>
<td>white rice: 25gms</td>
</tr>
<tr>
<th>Vegetable</th>
<td>2 cucumber slices</td>
<td>salad: 100gms</td>
<td>salad: 50gms</td>
</tr>
<tr>
<th>Desert</th>
<td>rasmalai</td>
<td>payasa:300ml</td>
<td>basundi:10gms</td>
</tr>
</table>
<p>
HEALTH IS WEALTH.
</P>
</body>
</html>

Output:

No comments:
Write comments

Featured post

List of Universities in Karnataka offering M.Sc Computer Science

The post-graduate programme in Computer Science (M.Sc Computer Science) contains two academic years duration and having a four semesters....

Popular Posts

Copyright @ 2011-2016