HTML

Note : All the links are not working now Soory I will fix it as soon as possible
If you find any mistake plz take 2 minute and  screen shot or email the mistake on below Emal address (pls Ignor in content spellng mistake...haha).

Topic  Navigation LinkDownload Link
Table exercise 1 Click Here
Table exercise 2 Click Here
Canvas 1 Click Here
Canvas 2 Click Here
Image Map Click Here


The solution of Table Exercise 1

Table 1 : 


1.    Create the following table with proper formatting:

A
                      B
C

IMAGE

IMAGE
D
E


<!DOCTYPE html>
<html>
<head>
    <title>HTML Table 1</title>
</head>
<body>

 <h3>Crete table with proper formatting : </h3>
<table border="1" align="center" valign="top" height="300" width="400">

 <tr valign="top">
    <td>A</td>
    <td align="center">B</td>
</tr>

 <tr>
  <td rowspan="2"  valign="top">C</td>
  <td align="center">IMAGE</td>
</tr>

 <tr>
  <td align="center">IMAGE</td>
</tr>

 <tr>
  <td valign="top">D</td>
  <td align="right" valign="top">E</td>
</tr>
</table>
</body>

</html>

Click to download a text file of Table 1.

Table 2



HotelsResorts
Business HotelsBeach resort
Liocure HotelHill Resort
Budget HotelHeritage Resort
<!DOCTYPE html>
<html>
<head>
   <title>Table 2</title>
</head>

<body>
<table>
<tr>
   <th>Hotels</th>
   <th>Resorts/th>
</tr>

<tr>
   <td>Business Hotels</td>
   <td>Beach resort</td>
</tr>

<tr>
   <td>Liocure Htels</td>
   <td>Hill Resort</td>
</tr>

<tr>
   <td>Budget Hotel</td>
   <td>Heritage Resort</td>
</tr>
</table>
</body>
</html>

 Click to download a text file of Table 2.

Table 3


Q3. Create the following table in HTML.

HTML

     1st Dec

1.    Table
2.    Frame
3.    form
                

                    IMAGE
         C


Link


<!doctype html>
<html>
<head>
<title>Qustion-2</title>
</head>

 <body>
<table align="center" border="1" width="500" height="500" cellpadding="0" cellspacing="0">
<tr valign=top>
<th>HTML</th>
<th colspan="2"></th>
<th>1st dec</th>
</tr>

 <tr>
<td rowspan="2"></td>
<td valign="top">
<ol>
<li>TABLE</li>
<li>Frame</li>
<li>Form</li>
</ol>
</td>
<td  align="center" rowspan="2">IMAGE</th>
<td valign=top rowspan="2" align=right>C</th>
</tr>
<tr>
<td></td>
</tr>

 <tr>
<td valign=top colspan=2><u>LINK</u></td>
<td></td>
<td></td>
</tr>

 </table>
</body>

</html>

 Click to download a text file of Table 3.

TABLE 4
Purchased Equipments (November 2016)
Item no
Item name
Item description
Price
Shipping handling, Installation etc
Expense
1
Monitor
IBM clone Computer
40,000
Shipping handling, Installation etc
2,000
2
RAM
1 GB RAM Module for computer
5,000
Shipping handling, Installation etc
1,400
Purchased Equipments (November 2016)
<!doctype html>
<html>
<head>
<style>
table tr
{
vertical-align:super;
}
</style>


</head>

<body>
<table border=1 cellspacing=0 align="center" height=400 width=600>
<tr>
<th colspan=4>Purchase</th>
</tr>

<tr>
<th rowspan=2>Item No</th>
<th rowspan=2>Item Name </th>
<th>Item Description</th>
<th>Price</th>
</tr>

<tr>
<td><b>Shipping,handling, Installation etc</b></td>
<td><b>Expense</b></td>
</tr>

<tr>
<td rowspan=2>1</td>
<td rowspan=2>Monitor</td>
<td>Please ignor content</td>
<td>40000</td>
</tr>

<tr>
<td>Please ignor content</td>
<td>2000</td>
</tr>

<tr>
<td rowspan=2>2</td>
<td rowspan=2>RAM</td>
<td>Please ignor content</td>
<td>5000</td>
</tr>

<tr>
<td>fhdj fdkh gh fjhgfkj</td>
<td>1400</td>
</tr>

<tr>
<td colspan=4 align="center ">Purchased Equipments(November 2016)</td>
</tr>

</table>
</body>
</html>


Click to download a text file of Table 4.

Table 5


Q5. Write HTML code to display the following table on webpage.
Table Example
<table> tag

Part of the merged cell

<tr> stands for table row
Table Control web page layout
Copyright © 2016
<!doctype html>
<html>
<head>
<title>Assignment 4</title>
</head>

<body>
<table border=2 align=center cellspacing=0 cellpadding=5>
<tr>
<td></td>
<td colspan=2>Table Example</td>
</tr>

<tr>
<td> table tag</td>
<td></td>
<td rowspan=2>Part of merged cell</td>
</tr>

<tr>
<td></td>
<td>Stand for table row</td>
</tr>

<tr align=center>
<td colspan=3>Table control webpage layout</td>
</tr>

<tr align=center>
<td colspan=3>Copyright @ 2016</td>
</tr>
</table>
</body>
</html>

Q6. Write HTML code to display the following frame on webpage.
42+5=21
Set background-color red


Rotate ‘HELLO’ Text

Subject
1.      HTML
2.      CF
3.      C

<!doctype html>

<html>
<head>
<title>Assignment 6</title>

</head>

<body>

<table border=2 align=center cellspacing=0 height=200 width=600>
<tr>
<td></td>
<td align=center>4<sup>2</sup>+5=21</td>
<td bgcolor=red rowspan=2>set backgound<br>color red </td>
</tr>

<tr>
<td></td>
<td></td>
</tr>
<tr>
  <td> Hello</td>
  <td></td>
  <td>
 Subject
 <ol>
    <li>HTML</li>
    <li>CF</li>
    <li>C</li>
 </ol>
  </td>
  </tr>

</table>
<p align=center><font color=red>Note : Hello only rotate by using css</font></p> 
</body>
</html>

Table 7
SCHEDULE OF DOCTORS IN A HOSPITAL
FLOOR no
Name
of Doctor
Specialty
Days in a week
Time
Contact no.
From
To










<!doctype html>

<html>

<head>

<style>

table tr

{
vertical-align:top;
}
</style>

<title>Assignment 7</title>
</head>

<body>
<font size=5px>
<table border=2 align=center cellspacing=0 height=300 width=800>
<tr>
<td colspan=8 align=center>SHEDULE OF DOCTORS IN HOSPITAL</td>
</tr>

<tr align=center>
<td rowspan=2 valign=middle>Floor num</td>
<td rowspan=2>Name <br>of Doctor</td>
<td rowspan=2 valign=middle>Speciality</td>
<td rowspan=2 valign=middle>Days in<br>a week</td>
<td colspan=2>Time</td>
<td rowspan=2 valign=middle>Contact<br>no</td>
</tr>

<tr>
<td>From</td>
<td>To</td>
</tr>

<tr>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>

</table>
</font>
</body>
</html>
Table 8
Q8.


                    About Myself
Name

Address



City

D.O.B.


Educational details
10th
11th
12th

<!doctype html>

<html>

<head>

<style>
table tr
{vertical-alignment:top;}
</style>
<title>Assignment 8</title>
</head>
<body>

<table border=2 align=center cellspacing=0 width=500>

<tr>
<th colspan=2>About Myself</th>
</tr>

<tr height=40>
<td width=100><object hspace=20>Name</object></td>
<td></td>
</tr>

<tr>
<td rowspan=3>Address</td>
<td height=20></td>
</tr>

<tr height=20>
<td></td>
</tr>

<tr height=20>
<td></td>
</tr>

<tr>
<td height=40>city</td>
<td></td>
</tr>

<tr height=40>
<td>D.B.O</td>
<td></td>
</tr>

<tr>
<td rowspan=3>Educational <br> Detail</td>
<td>10th</td>
</tr>

<tr>
<td>11th</td>
</tr>

 <tr>
<td>12th</td>
</tr>
</table>
</body>
</html>

Mark sheet (BCA sem-1)
Introduction to the Internet and HTML
Roll No
Practical
Theory
Total



















<!doctype html>
<html>
<head>
<title>Assignment 9</title>
<style>
table tr
{vertical-align:top;}
</style>
</head>

<body>
<table border=2 cellspacing=0 height=300 width=500 align=center>
<tr>
<td colspan=4 align="center">Mark sheet(BCA sem-1)</td>
</tr>
<tr>
<td colspan=4 align="center">Intro to HTML</td>
</tr>

<tr>
<td>Roll no</td>
<td>Practical</td>
<td>Theory</td>
<td>Total</td>
</tr>

<tr>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>

<tr>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>

</table>
</body>
</html>

Q10. 
Name

Date of Birth

Nationality

Address

Street

Town

Dist

State



















<!doctype html>
<html>
<head>
<title>Assignment 10</title>
<style>
table tr
{
vertical-align:top;
text-align:center;
}
</style>
</head>

<body>
<table border=2 cellspacing=0 height=300 width=600 align=center >

<tr>
<td>Name</td>
<td colspan=2></td>
</tr>

<tr>
<td>Date of birth</td>
<td colspan=2></td>
</tr>

<tr>
<td>Natonality</td>
<td colspan=2></td>
</tr>

<tr>
<td rowspan=5>Address</td>
<td width=200></td>
<td width=200></td>
</tr>

<tr>
<td>Street</td>
<td></td>
</tr>

<tr>
<td>Town</td>
<td></td>
</tr>

<tr>
<td>Dist</td>
<td ></td>
</tr>

<tr>
<td> State</td>
<td ></td>
</tr>

</table>
</body>
</html>

Q11.
                                                   ABC  Infosystems Pvt. Ltd.
Date
5/12/2012
Customer Name
XYZ
Sr. No
Item Name
Qty
Rate
Amount
1.
Keyboard
5
800
4000
2.
Monitor
2
15000
30000
Total
34000
VAT(5%)
 1700
Total Payable Amount
35700


<!doctype html>

<html>

<head>

<title>Assignment 11</title>

</head>


<body>
<font face="Arial">
<table cellspacing=0 align=center border=2 width=500 height=300 cellpadding=7>

<tr>
<td colspan=5 align=center>ABC infosystems pvt. ltd.</td>
</tr>

<tr>
<td colspan=2 align=center>Date</td>
<td colspan=3>8/8/2019</td>
</tr>

<tr>
<td colspan=2 align=center>Costomer Name</td>
<td colspan=3>XYZ</td>
</tr>

<tr>
<th>Sr.No</th>
<th>Item name</th>
<th>Qty</th>
<th>Rate</th>
<th>Amount</th>
</tr>

<tr>
<td>1.</td>
<td>Keyboard</td>
<td>5</td>
<td>800</td>
<td>4000</td>
</tr>

<tr>
<td>2.</td>
<td>Monitor</td>
<td>2</td>
<td>15000</td>
<td>30000</td>
</tr>

<tr>
<td align="right" colspan=4>Total</td>
<td>34000</td>
</tr>

<tr>
<td align="right" colspan=4>VAT(5%)</td>
<td>1700</td>
</tr>

<tr>
<td align="right" colspan=4>Total Payble Amount</td>
<td>35700</td>
</tr>


</table>
</font>
</body>
</html>
Subject
Roll no : 1
Roll No : 2
HTML
Practical
40
55
Theory
50
50
C
Practical
45
50
Theory
40
40
PCS
Practical
55
45




This is too easy you can do it...hahaha

Table 13

A
                                                                                         B








       C
D




   E
            F
G


  IMAGE
H





<!DOCTYPE html>
<html>
<head>
<title>HTML Table 1</title>
</head>
<body>
<table border="1" cellspacing=0 align="center" height="300" width="400" cellpadding=5>
<tr valign="top">
<td>A</td>
<td align="right" colspan=5>B</td>
</tr>

 <tr>
<td valign=bottom rowspan=3><object hspace=20px>C</td>
<td rowspan=2 valign=top>D</td>
<td rowspan=2 valign=middle>E</td>
<td rowspan=2 valign="top" align="right">F</td>
<td valign=top >G</td>
<td rowspan=2></td>
</tr>

 <tr>
<td height=20></td>
</tr>

 <tr valign="top">
<td height="10">IMAGE</td>
<td height="10">H</td>
<td></td>
<td></td>
<td></td>
</tr>
</table>
</body>
</html>
Click to download a text file of Table 13.

Table Exersice 2



1. Create the HTML table for the following:
    
A
B
C
D
E
F
G
H
S
I
J
K
L
M
N
O
P
Q
R
T












Ans )

<!doctype html>
<html>
<head>
<title>Assignment 1</title>
<style>
table tr
{
text-align:center;
vertical-align:bottom;
}
</style>
</head>

<body>
<table height=250 width=500 cellspacing=0 border=1>

<tr>
<td>A</td>
<td>B</td>
<td colspan=4>C</td>
</tr>

<tr>
<td>D</td>
<td colspan=2>E</td>
<td>F</td>
<td>G</td>
<td>H</td>
</tr>

<tr>
<td rowspan=3>S</td>
<td>I</td>
<td>J</td>
<td>K</td>
<td>L</td>
<td>M</td>
</tr>


<tr>
<td>N</td>
<td>O</td>
<td>P</td>
<td>Q</td>
<td>R</td>
</tr>

<tr>
<td colspan=5>T</td>
</tr>

</table>
</body>

</html>

3.  Create the HTML table for the following:
A
B
C
D
E
F
G
H
I
J



<!doctype html>
<html>

<head>
<style>
table tr
{
text-align:center;
}
</style>

<title>Assignment 3</title>

</head>

<body>

<table align="center" height=300 width=400 cellspacing=0 border=2>
<tr>
<td colspan=5>A</td>
</tr>

<tr>
<td rowspan=5>B</td>
<td colspan=4>C</td>
</tr>

<tr>
<td rowspan=3>D</td>
<td rowspan=3>E</td>
<td rowspan=3>F</td>
<td>G</td>
</tr>

<tr>
<td>H</td>
</tr>
<tr>
<td>I</td>
</tr>
<tr>
<td colspan=5>J</td>
</tr>

</table>

</body>
</html>


                                HTML                        

 5. Create the HTML table for the following:
Email Sign Up Form


First Name
:

Last Name
:
Email id required
:
Age
:
Use Combo Box Here that allow user to select Age
Hobby
:
Use Cricket, Reading, Writing, Watching Hobbies
 Address
:
<use Check Box>  I agree with terms and service

Ans)

<!doctype html>
<html>
<head>
<title>Assignment 5</title>
</head>
<body>
<table align="center" cellpadding=5 height=300 width=400 cellspacing=0 border=2>
<tr>
<th colspan=3><u>Email Sign Up Form</u></th>
</tr>
<tr height=20>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td>First Name</td>
<td> : </td>
<td><input type="text"></td>
</tr>
<tr>
<td>Last Name</td>
<td> : </td>
<td><input type="text"></td>
</tr>
<tr>
<td>Email id *</td>
<td> : </td>
<td><input type="text" required></td>
</tr>
<tr>
<td>Age</td>
<td> : </td>
<td><input type="date"></td>
</tr>

<tr>
<td>Hobby</td>
<td> : </td>
<td><input type="text"></td>
</tr>

<tr valign=top>
<td >Address</td>
<td > : </td>
<td height="3"><textarea style="overflow:scroll;resize:none;" rows=4 cols=20></textarea></td>
</tr>

<tr>
<th colspan=3 align=center><input type=checkbox><u>I agree with terms and service</u></th>
</tr>
</table>
</body>
</html>


6. Create the HTML table for the following:

Table
Chair


unit profit
400
100





Resource
Resource

Resource used per unit production
Used
Available
Oak
50
25
2500
2500
Labour hr
6
6
300
480






Table
Chair

Total profit
Units produced
50
0

20000


<!doctype html>
<html>

<head>
<style>
</style>
<title>Assignment 6</title>
</head>
<body>
<table align="center" cellpadding=5 height=300 width=600 cellspacing=0 border=2>

<tr>
<th></th>
<th>Table</th>
<th>Chair</th>
<th></th>
<th></th>
</tr>

<tr>
<td>Unit profit</td>
<td>400</td>
<td>100</td>
<td></td>
<td></td>
</tr>

<tr>
<td></td>
<td></td>
<td></td>
<th>Resource</td>
<th>Resource</td>
</tr>
<tr>
<td></td>
<th colspan=2>Resource used per unit<br>producton</td>
<th>Used</th>
<td>Available</td>
</tr>


<tr>
<td>oak</td>
<td>23</td>
<td>43</td>
<td>4554</td>
<td>4545</td>
</tr>

<tr>
<td>gdfdf hg</td>
<td>5</td>
<td>5</td>
<td>454</td>
<td>656</td>
</tr>

<tr>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>

<tr>
<td></td>
<th>table</th>
<th>chair</th>
<th></th>
<th>total<br>profitt</th>
</tr>

<tr>
<th>ubtdd<br>probdjd</th>
<td></td>
<td></td>
<td></td>
<th></th>
</tr>

</table>
</body>
</html>

HTML Canvas 1

<!DOCTYPE html>
<html>
<head>
<title>Canvas</title>
</head>
<body>
<canvas id="myCanvas" height=300 width=600 style="border:2px solid">
</canvas>
<script>
var c = document.getElementById("myCanvas");
var ctx = c.getContext("2d");
ctx.moveTo(0,0);
ctx.lineTo(600,300);
ctx.moveTo(600,0);
ctx.lineTo(0,300);
ctx.moveTo(300,0);
ctx.lineTo(300,300);
ctx.moveTo(0,150);
ctx.lineTo(600,150);
ctx.stroke();
</script>
</body>
</html>



HTML Canvas 2 


Code for Canvas 2

<!DOCTYPE html>
<html>
<head>

</head>
<body>

<p>Canvas</p>
<canvas id="myCanvas" height=300 width=500 style="border:2px solid;">
</canvas>

<script>
var canvas = document.getElementById("myCanvas");
var ctx = canvas.getContext("2d");
ctx.moveTo(0,100);1`
ctx.lineTo(500,100);
ctx.moveTo(0,200);
ctx.lineTo(500,200);
ctx.stroke();

</script>
</body>
</html>
To download click here


Q.1 Draw a Picture in paint and link all parts with hotspot link (Image map)

Image : 


To Link Above image with image-map the code is :

<!DOCTYPE html>
<html>
<body>
<img src="imagemap.png" alt="does not support" usemap="#smile">

<map name="smile">

<area shape="circle" coords="245,265,50" href="nana.jpg" alt="Left Eye" >
<area shape="circle" coords="455,260,50" href="nana.jpg" alt="Right Eye">
<area shape="rect" coords="207,415,501,489" href="nana.jpg" alt="smile">

</map>
</body>
</html>

<!-- Note this You to put your own image and change path in href attribute -->

Click here to download html file 

Comments

Post a Comment

Popular posts from this blog

C++ Practice Program

Image
Questions Answer PRG -1 Ans #include<iostream.h> #include<conio.h> class smaller { public : int d1,d2; void min(); }; void smaller::min() { cout<<"Enter D1 = "; cin>>smaller::d1; cout<<"Enter D2 = "; cin>>smaller::d2; if(d1>d2) cout<<"D2 is smaller than D1"; else cout<<"D1 is smaller than D2"; } void main() { smaller min1; clrscr(); min1.min(); getch(); } PRG - 2 Answer //Prg -2 odd or even #include<iostream.h> #include<conio.h> class number { public: int d1; void check(); }; void number::check() { cout<<"Enter d1 = "; cin>>d1; if(d1==0) cout<<"D1 is Zero"; else if(d1%2==0) cout<<"D1 = "<<d1<<" is Even number." ; else cout<<"D1 = "<<d1<<" is Odd number."; } void main() { number num1; clrscr(); num1.check(); ge...
Read more

Cloud Computing Important Question-Answer for University Exam

Image
UNIT 1 1. What is the innovative characteristic of cloud computing? OR 13. What is the major advantage of cloud computing? OR 4) Define cloud computing and identify its core features. Core Features of Cloud Computing No up-front commitments: Cloud computing does not require up-front commitment from the user. Users can just use infrastructure, platform and software as per requirement. They don’t have to worry what’s happening behind the scene. On-demand access: Cloud computing services can be used according to the user demand. For example, any user data analytics company uses amazon EMR or EC2 cluster for Hadoop data processing. Then user turn on the cluster when he/she need them, and he/she pay the money for the time period he/she have used and when his/her work is done, he/she terminate the cluster. Nice pricing: Cloud computing services are cheap with nice prices in case of some services and infrastructure we use. We can realize this even more when we talk abo...
Read more

Software Testing Gujarat University Important Questions For Exam

Image
:Unit-1 Introduction 1. What is software testing? List and explain goals of software testing. ANS: Testing is the process of executing a program with the intent of finding errors. The main goal of software testing is to find bugs as early as possible and fix bugs and make sure that the software is bug-free. The goals of software testing may be classified into three major categories, as follows: Immediate Goals Long-term Goals Post-Implementation Goals 1. Immediate Goals :       These objectives are the direct outcomes of testing.      Some of these are covered in detail below: Bug Discovery :  This is the immediate goal of testing to find error at any stage of software development. The more bugs discovered at early stage, The batter will be the success ratio of Software Testing. Bug Prevention :  This is immediate action of bug discovery, that occurs as a result of bug discovery. Everyone in the software development team learns how to code sa...
Read more