Scribd
Upload
142 views38 pages

HTML Basics - Div Tag: Hints

The document provides instructions and sample code for creating an HTML page using different HTML elements like <div>, <span>, and <table>. It includes three sections - the first asks to create a page using <div> tags to separate paragraphs, the second asks to use <span> tags to highlight parts of a paragraph, and the third asks to create a table using the border-collapse property and colspan attribute. Sample screenshots and descriptions of the desired output are provided for each section.

Uploaded by

nagendra
Copyright
© © All Rights Reserved
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
Download as docx, pdf, or txt
142 views38 pages

HTML Basics - Div Tag: Hints

The document provides instructions and sample code for creating an HTML page using different HTML elements like <div>, <span>, and <table>. It includes three sections - the first asks to create a page using <div> tags to separate paragraphs, the second asks to use <span> tags to highlight parts of a paragraph, and the third asks to create a table using the border-collapse property and colspan attribute. Sample screenshots and descriptions of the desired output are provided for each section.

Uploaded by

nagendra
Copyright
© © All Rights Reserved
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
Download as docx, pdf, or txt
Download as docx, pdf, or txt
You are on page 1/ 38

HTML Basics - div tag

Design an HTML page that will show the variation between each paragraph using the div
element as shown in the screenshot.
 
Hints :
Tag <div> :
The HTML <div> tag is used for defining a section of your document. With
the div tag, you can group large sections of HTML elements together and
format them with CSS. By default, browsers always place a line break
before and after the <div> element. However, this can be changed with
CSS.
Syntax :
<div> XXX </div>

Sample Screenshot :

Constraints :
Note :

Content of the page should be present as shown in the screenshot.


Kindly refer to the content which is given as a part of the description.

Content :

div - We help you make more of your events


Eventsforce helps you manage events more effectively by simplifying your everyday tasks
and processes. It can deliver all the functionality you require for any type of event
regardless of size or complexity. More importantly, Eventsforce solutions can help you save
time, cut costs and make better use of your event data.
div - We care about your events
At Eventsforce, we care that you succeed. We believe that technology alone is not enough
to deliver sustainable results for your events and we are committed to offering more. From
event planning and account management to support services and software development the
collective experience of our staff helps us bring a collaborative approach to customers,
which is reflected across everything we do.
div - We understand our customers
Eventsforce is the preferred technology partner for events professionals working in a broad
range of industries from associations to corporations, universities to government and PCOs
to agencies. We have considerable experience and history of supporting organisations
across all these industries and take pride in understanding what matters most to the events
professionals working for them.
<br>

Template Code:

Click here to download the template code.


 

PROGRAM
 
<!DOCTYPE html>

<html>

<body>

<h2>We help you make more of your events</h2>

<div id="firstDiv">

Eventsforce helps you manage events more effectively by simplifying your everyday tasks and
processes.

It can deliver all the functionality you require for any type of event regardless of size or complexity.

More importantly, Eventsforce solutions can help you save time, cut costs and make better use of
your event data.

</div>

<h2> We care about your events </h2>

<div id="secondDiv">

At Eventsforce, we care that you succeed.

We believe that technology alone is not enough to deliver sustainable results for your events and
we are committed to offering more.
From event planning and account management to support services and software development the
collective experience of our staff helps us bring a collaborative approach to customers,

which is reflected across everything we do.

</div>

<h2> We understand our customers</h2>

<div id="thirdDiv">Eventsforce is the preferred technology partner for events professionals working in
a broad range of industries from associations to corporations,

universities to government and PCOs to agencies.

We have considerable experience and history of supporting organisations across all these industries
and take pride in understanding what matters

most to the events professionals working for them.

</div>

<br>

</body>

</html>

………………………………………………………………………………………………………………………………………………………………

HTML Basics - span tag


Design an HTML page that will show the informative webpage with highlighted facts using
the span element.

Sample Screenshot :

Constraints :
Note :

Content of the page should be present as shown in the screenshot.


Kindly refer to the content which is given as a part of the description.

Content :

Eventsforce helps you manage events more effectively by simplifying your everyday tasks
and processes. It can deliver all the functionality you require for any type of event –
regardless of size or complexity. More importantly,  Eventsforce solutions can help you save
time, cut costs and make better use of your event data.

Template Code :

Click here to download the template code.


 

PROGRAM
 

HTML Basics - span tag


Design an HTML page that will show the informative webpage with highlighted facts using
the span element.

Sample Screenshot :
Constraints :

Note :

Content of the page should be present as shown in the screenshot.


Kindly refer to the content which is given as a part of the description.

Content :

Eventsforce helps you manage events more effectively by simplifying your everyday tasks
and processes. It can deliver all the functionality you require for any type of event –
regardless of size or complexity. More importantly,  Eventsforce solutions can help you save
time, cut costs and make better use of your event data.

Template Code :

Click here to download the template code.


 

PROGRAM
 
<!DOCTYPE html>

<html>

<p>Eventsforce helps you manage events more effectively

by <span> simplifying your everyday tasks and processes</span>

It can <span>deliver all the functionality</span> you require for

any type of event – regardless of size or complexity.

More importantly, Eventsforce solutions can <span>help you save time,


cut costs</span> and make better use of your event data.

</p>

</html>

………………………………………………………………………………………………………………………………………………………………….

Tables - border collapse


 

Design an HTML page using a table with border-collapse as shown in the screenshot.
 
Syntax :  
border-collapse: separate|collapse|initial|inherit;

Sample Screenshot :

Constraints :

The table doesn't contain border color/style. The table will look as follows, after using
the border-collapse property

Note :

The web page should be displayed as shown in the screenshot.


Kindly refer to the content which is given as a part of the description.

Content :
 
Duratio
Name Venue
n
Corporate Events ABC Hall 2 hrs
Wedding Planning Country Club 3 hrs
Product Launches Echo Venue 2 hrs
Seminor on Cloud XYZ Hall 4 hrs
Computing
Heavenly Fashion Spark Venue 2 hrs
Gala Dinners National Resort 2 hrs
International
Award Ceremony 3 hrs
venue

Template Code :

Click here to download the template code.


 

PROGRAM
 
<!DOCTYPE html>

<html>

<body>

<h2 align="center">Event Schedule</h2>

<table style="border-collapse:collapse">

<tr>

<th>Name</th>

<th>Venue</th>

<th>Duration</th>

</tr>

<tr>

<td>Corporate Events</td>

<td>ABC Hall</td>

<td>2 hrs</td>

</tr>

<tr>

<td>Wedding Planning</td>
<td>Country Club</td>

<td>3 hrs</td>

</tr>

<tr>

<td>Product Launches</td>

<td>Echo Venue</td>

<td> 2 hrs</td>

</tr>

<tr>

<td>Seminor on Cloud Computing</td>

<td>XYZ Hall</td>

<td> 4 hrs</td>

</tr>

<tr>

<td>Heavenly Fashion</td>

<td>Spark Venue</td>

<td> 2 hrs</td>

</tr>

<tr>

<td>Gala Dinners</td>

<td>National Resort</td>

<td> 2 hrs</td>

</tr>

<tr>

<td>Award Ceremony</td>
<td>International venue</td>

<td> 3 hrs</td>

</tr>

</table>

</body>

</html>

…………………………………………………………………………………………………………………………………………………………………

Tables - colspan
Design an HTML page for the schedule list using colspan attribute in the table as shown in
the table.

Sample Screenshot :

Constraints :

Content :

h2 tag - Event Schedule 


 
Name Venue  Start Time End Time
Corporate Events ABC Hall, 3rd Floor Yet to start
Wedding Planning Country Club 1.1.2019 7.00AM 1.1.2019 9.00AM
City Tower, Hall No
Product Launches Yet to start
2
Seminar on Cloud XYZ Hall Yet to start
Computing
Heavenly Fashion Spark Venue 21.3.2018 5.00PM 21.3.2018 8.00PM
12.1.2018 7.00 12.1.2018 10.00
Gala Dinners National Resort
PM PM
Award Ceremony Echo Venue Yet to start
Asian Party RK Restaurant Yet to start
Dinner Tonight Tower, Hall No 4 Yet to start
Incentive Party Five Star Hall Yet to start
 

Note :

The web page should be displayed as shown in the screenshot.


Kindly refer to the content which is given as a part of the description.
Use colspan attribute to merge two columns in the table.

Template Code :

Click here to download the template code.


 

PROGRAM
 <html>
<head>
<title>Tables</title>
</head>
<h2>Event Schedule </h2>
<body>
<table border ="5">
<tr>
<th>Name</th>

<th>Venue</th>
<th>Start Time</th>

<th>End Time</th>
</tr>
<tr>
<td>Corporate Events</td>
<td>ABC Hall, 3rd Floor</td>
<td colspan ="2">Yet to start</td>
</tr>
<tr>
<td>Wedding Planning</td>
<td>Country Club</td>
<td>1.1.2019 7.00AM</td>
<td>1.1.2019 9.00AM</td>
</tr>
<tr>
<td>Product Launches</td>
<td>City Tower, Hall No 2</td>
<td colspan="2">Yet to start</td>
</tr>
<tr>
<td>Seminar on Cloud Computing</td>
<td>XYZ Hall</td>
<td colspan="2">Yet to start</td>
</tr>
<tr>
<td>Heavenly Fashion</td>
<td>Spark Venue</td>
<td>21.3.2018 5.00PM</td>
<td>21.3.2018 8.00PM</td>
</tr>
<tr>
<td>Gala Dinners</td>
<td>National Resort</td>
<td>12.1.2018 7.00 PM</td>
<td>12.1.2018 10.00 PM</td>
</tr>
<tr>
<td>Award Ceremony</td>
<td>Echo Venue</td>
<td colspan="2">Yet to start</td>
</tr>
<tr>
<td>Asian Party</td>
<td>RK Restaurant</td>
<td colspan="2">Yet to start</td>
</tr>
<tr>
<td>Dinner Tonight</td>
<td>Tower, Hall No 4</td>
<td colspan="2">Yet to start</td>
</tr>
<tr>
<td>Incentive Party</td>
<td>Five Star Hall</td>
<td colspan="2">Yet to start</td>
</tr>

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

Links with images


Design a webpage using Links with images as shown in the screenshot.  

Sample Screenshot :
Constraints :
Onclicking each image, the corresponding HTML page will appear.
Note :

The Webpage should be present as shown in the screenshot.


Kindly refer to the content which is given as a part of the description.
Kindly don't change the template, only make the changes in the index.html file.
Content :

Pink Frag Event Organizer


Wedding Invitation
1. <a> tag
id -anchor1
href-Wedding.html
src-wedding.jpg
height-350
width-450
id-image1
Corporate Events
2. <a> tag
id -anchor2
href-Corporate.html
src-corporate.jpg
height-350
width-450
id-image2
Social Gatherings
3. <a> tag
id -anchor3
href-SocialGatherings.html
src-social-gathering-2.jpg
height-350
width-450
id-image3

Template Code :

Click here to download the template code.


 

PROGRAM
 
<!DOCTYPE html>

<html>

<!--Enter your text here!-->


<body>

<h1>Pink Frag event Organizer</h1>

<h3>wedding Invitation</h3>

<a id='anchor1' href='Wedding.html'><img id="image1" src="wedding.jpg"></a>

<h3>Corporate Events</h3>

<a id='anchor2' href='Corporate.html'><img id="image2" src="corporate.jpg"></a>

<h3>Social Gatherings</h3>

<a id='anchor3' href='SocialGatherings.html'><img id="image3" src="social-gathering-2.jpg"></a>

</body>

</html>

…………………………………………………………………………………………………………………………………………………………………

Links - referring social networks


Design an HTML for creating a webpage with hyperlinks referring to the social networks as
shown in the screenshot.
 
Hints :
Tag <a>
The <a> tag defines a hyperlink, which is used to link from one page to
another. Syntax : <a href = "#">...</a> Tag <img> The <img> tag defines an
image in an HTML page. Syntax : <img src = "xxx.png" >

Sample Screenshot :
Constraints :

On clicking the icon, it should open the respective links which are given in the content.

Content :

Pink Frag Event Organizer


Service Description
We are indulged in offering a Promotional Event Management. These services are provided
by our team of professionals as per the requirement of the client. These services are highly
praised for their features like sophisticated technology, effective results and reliability. We
offer these services in a definite time frame and at affordable rates.
Keep in touch with us

Use the template images to display the FB, Twitter, LinkedIn icons in the image tag. FB,
Twitter, LinkedIn icons have to go below link for respective pages. 
For FB - https://www.facebook.com/
For Twitter - https://twitter.com/
For linkedIn - https://www.linkedin.com/
Set the width and height for images as 25 px.

Constraints :

Tag 'img' must be present a minimum of 3 times in the HTML page.


The 'img' tag should be present inside the 'a' tag.
Use id attribute for 3 img tags as shown in the sample screenshot 2.
Use the respective links in the content to redirect to the respective page.
Don't change the order of a tag

Note :

Content of the page should be present as shown in the screenshot.


Kindly refer to the content which is given as a part of the description.

Template Code :

Click here to download the template code.


 
PROGRAM
 <html>
<h1>Pink Frag Event Organizer</h1>
<h2>Service Description</h2>
<p>We are indulged in offering a Promotional Event Management.
These services are provided by our team of professionals as
per the requirement of the client. These services are highly
praised for their features like sophisticated technology,
effective results and reliability. We offer these services in
a definite time frame and at affordable rates.</p>
<p align="center">Keep in touch with us</p>
<a href='https://www.facebook.com/'><img id='image1' src="facebook.png" align='center' width='25px'
height='25px'></a>
<a href='https://twitter.com/'><img id='image2' src="twitter.png" align='center' width='25px' height='25px'></a>

<a href='https://www.linkedin.com/'><img id='image3' src="linkedin.png" align='center' width='25px'


height='25px'></a>

</html>

………………………………………………………………………………………………………………………………………………………

CSS - Internal styling by id


Design a webpage using Internal styling by id as shown in the screenshot.

Sample Screenshot :

Constraints :

Additional Constraints :

The webpage design shall be of internal style.


The content is given in the template itself.
The colors shall be the same as given in the constraints.
Use the id attribute for styling the webpage.

h1 titles are in pink color(#F835C0)


h2 titles are in red color(#ff0000)
h3 titles are in green color(#15D365)
h5 titles are in violet color( #9F41F5)
Note :

Content of the page should be present as shown in the screenshot.


Kindly refer to the content which is given as a part of the description.

Template Code :

Click here to download the template code.


 

PROGRAM
 
<!DOCTYPE html>

<html>

<head>

<title>My First Website</title>

<meta charset="UTF-8">

<meta name="viewport" content="width=device-width, initial-scale=1.0">

<style>

h1{

color:#F835C0;

h2{

color:#ff0000;

h3{

color:#15D365;

h5{
color: #9F41F5;

</style>

</head>

<h1 id='h1Tag'>Pink Frag Event Organizer</h1>

<hr>

<h2 id='h2Tag'>Service Description</h2>

<p>We are indulged in offering a Promotional Event Management.

These services are provided by our team of professionals as

per the requirement of the client.

These services are highly praised for their features like

sophisticated technology, effective results and reliability. We offer

these services in a definite time frame and at affordable rates.

</p>

<hr>

<h2 id='h2Tag'> Features</h2>

<h5 id='h5Tag'>Customized services</h5>

<h5 id='h5Tag'>On-time completion</h5>

<h5 id='h5Tag'>Execution in tandem with clients demand</h5>

<hr>

<h2 id='h2Tag'>About Us</h2>

<p> Pink Frag Event is a reputed organization,

which has come into being in 2009, as a Sole Proprietorship

Firm, with a sole aim of achieving the trust and support of


large customers. We have indulged our all endeavors towards

offering trustworthy Wedding Event Management, Promotional

Event Management, Birthday Party Management and many more.

All our services are reliable and offered keeping the exact

customers’ preferences and choice in mind. To offer these

services, we have hired specialized professionals, who are

capable of understanding as well as accomplishing the specific

customers’ desires. We have adopted modern technology,

to cope up with the challenges of industry. We keep all quality

parameters in mind, so that we cannot make any compromise in

terms of the excellence of products. </p>

<hr>

<h2 id='h2Tag'>Contact Us</h2>

<h3 id='h3Tag'>Address</h3>

<p>14/509A,Sterlin Street,Nungambakkam

Chennai - 600034.</p>

<h3 id='h3Tag'>Mobile</h3>

<p>Manager-9596645125</p>

<h3 id='h3Tag'>Landline</h3>

<p>0422-2727272</p>

<h3 id='h3Tag'>EMail</h3>

<p>pinkfragevent123@gmail.com pinkfragOfficial@gmail.com

</p>

</body>

</html>
……………………………………………………………………………………………………………………………………………………………….

CSS - text transform


Design an HTML page using text-transform property in CSS as shown in the screenshot.

Sample Screenshot :
Constraints :
Additional Constraints :

The following text-transform properties must be applied for the <div> elements respectively
Apply text-transform - none for div with class 'wedding'
Apply text-transform - uppercase for div with class 'conference'
Apply text-transform - lowercase for div with class 'birthdayParty'
Apply text-transform - capitalize for div with class 'liveShows'
Apply text-transform - inherit for div with class 'photography'

Note :

Content of the page should be present as shown in the screenshot.


Kindly refer to the content which is given as a part of the description

Content :

Pink Frag Event Organizer


Wedding Event
Our passionate team of wedding experts are meticulous in ensuring that every aspect of the
day is seamlessly stylish, from our delectable menus to glorious flowers, venue finding and
dressing, production and entertainment.
Conferences
Our conferences are designed to meet the ever-changing needs of the customer, with the
goal of bringing industry professionals together to share their expertise, exchange ideas and
facilitate business.
Birthday Party
Planning a birthday party? Whether a wild party with friends or a crazy party for the
kids,Most importantly, Purple7 helps you gather that ever important catering services will be
arranged as per your requirements and budget.Engage your guests in variety of
events.Host the party with a lively anchor.
Live Shows
If you are looking for entertainment any time of the day or night, then you are at the right
place. We bring you the list of all the hot and happening entertaining events/activities going
on or lined up in Coimbatore. You just need to tell us your mood and taste in entertainment,
rest we ensure you get the best time of your life.
Photography
We capture your best moments in life and make it an everlasting treasure to preserve. We
are well experienced in events coverage, wedding photography, candid photography,
modelling photography and industrial photography. Make use of our photography services
for a lasting impression.
Template Code :

Click here to download the template code.


 

PROGRAM
<!DOCTYPE HTML>
<HTML>

<!--ENTER YOUR CODE HERE-->


<HEAD>
<STYLE>
DIV.WEDDING {
BORDER: BLACK;
BACKGROUND-COLOR: #FF69B4;
}

DIV.CONFERENCE {
BORDER: BLACK;
BACKGROUND-COLOR: BLUE;
TEXT-TRANSFORM: UPPERCASE;
}

DIV.BIRTHDAYPARTY {
BORDER: BLACK;
BACKGROUND-COLOR: SEA GREEN;
TEXT-TRANSFORM: LOWERCASE;
}

DIV.LIVESHOWS {
BORDER: BLACK;
BACKGROUND-COLOR: PEACH;
TEXT-TRANSFORM: CAPITALIZE;
}

DIV.PHOTOGRAPHY {
BORDER: BLACK;
BACKGROUND-COLOR: YELLOW;
TEXT-TRANSFORM: INHERIT;
}
</STYLE>
</HEAD>
<BODY>
<H1>PINK FRAG EVENT ORGANIZER</H1>

<DIV CLASS="WEDDING">
<H3>WEDDING EVENT</H3>
OUR PASSIONATE TEAM OF WEDDING EXPERTS ARE METICULOUS IN
ENSURING THAT
EVERY ASPECT OF THE DAY IS SEAMLESSLY STYLISH, FROM OUR
DELECTABLE MENUS
TO GLORIOUS FLOWERS, VENUE FINDING AND DRESSING, PRODUCTION AND
ENTERTAINMENT.
</DIV>

<DIV CLASS="CONFERENCE">
<H3>CONFERENCES</H3>
OUR CONFERENCES ARE DESIGNED TO MEET THE EVER-CHANGING NEEDS
OF THE
CUSTOMER, WITH THE GOAL OF BRINGING INDUSTRY PROFESSIONALS
TOGETHER TO
SHARE THEIR EXPERTISE, EXCHANGE IDEAS AND FACILITATE BUSINESS.
</DIV>

<DIV CLASS="BIRTHDAYPARTY">
<H3>BIRTHDAY PARTY</H3>
PLANNING A BIRTHDAY PARTY? WHETHER A WILD PARTY WITH FRIENDS OR A
CRAZY
PARTY FOR THE KIDS,MOST IMPORTANTLY, PURPLE7 HELPS YOU GATHER
THAT EVER
IMPORTANT CATERING SERVICES WILL BE ARRANGED AS PER YOUR
REQUIREMENTS AND
BUDGET.ENGAGE YOUR GUESTS IN VARIETY OF EVENTS.HOST THE PARTY
WITH A
LIVELY ANCHOR.
</DIV>

<DIV CLASS="LIVESHOWS">
<H3>LIVE SHOWS</H3>
IF YOU ARE LOOKING FOR ENTERTAINMENT ANY TIME OF THE DAY OR NIGHT,
THEN
YOU ARE AT THE RIGHT PLACE. WE BRING YOU THE LIST OF ALL THE HOT
AND
HAPPENING ENTERTAINING EVENTS/ACTIVITIES GOING ON OR LINED UP IN
COIMBATORE. YOU JUST NEED TO TELL US YOUR MOOD AND TASTE IN
ENTERTAINMENT, REST WE ENSURE YOU GET THE BEST TIME OF YOUR LIFE.
</DIV>

<DIV CLASS="PHOTOGRAPHY">
<H3>PHOTOGRAPHY</H3>
WE CAPTURE YOUR BEST MOMENTS IN LIFE AND MAKE IT AN EVERLASTING
TREASURE
TO PRESERVE. WE ARE WELL EXPERIENCED IN EVENTS COVERAGE,
WEDDING
PHOTOGRAPHY, CANDID PHOTOGRAPHY, MODELLING PHOTOGRAPHY AND
INDUSTRIAL
PHOTOGRAPHY. MAKE USE OF OUR PHOTOGRAPHY SERVICES FOR A
LASTING IMPRESSION.
</DIV>
</BODY>
</HTML>

‘’’’’’’’’’’’’’’’’’’’’’’’’’’’’’’’’’’’’’’’’’’’’’’’’’’’’’’’’’………………………………………………………………………………………………………

CSS with Images


Design an HTML page with images and alt attribute as shown in the screenshot.

Sample Screenshot :

Constraints :

The image should be displayed in the HTML page.


alt=”wedding”

Note :

The web page should be displayed as shown in the screenshot.


Kindly refer to the content which is given as a part of the description.

Content :

h1 - Wedding Album
img src attribute ="wedding.jpg"

Template Code :

Click here to download the template code.


 

PROGRAM
 <!DOCTYPE html>
<html>

<!--Enter your text here!-->


<body>
<h1>Wedding Album</h1>
<img alt='wedding' src='wedding.jpg'>
</body>

</html>
………………………………………………………………………………………………………………………………………

 Basic program html

…………………..
<html>
<head>
<style>
.register{
Border:1px solid black;
}
#player{
Border:1px solid black;
Padding-right:40px;
Margin-bottom:5px;
}
#medical{
Border:1px solid black;
Margin-right:5px;
}
</style>
</head>
<body>
<center>
<table id=”register”>
<tr>
<td><h2>Player Registration Form</h2></td>
</tr>
</table>
</center>
<div class=”register”>
<div class=”player”>
<center>
<form>
<table id=”player”>
<th>Player Information</th>
<tr>
<td>Personal Name:</td>
<td><input type=”text” id=”name”></td>
<td>Country:</td>
<td><select id=”country”> <option>India</option>
<option>Japan</option></select></td>
</tr>
<tr>
<td>Birthdate(mm/xx/yyyy):</td>
<td><input type=”text” id=”dob”></td>
<td>Email</td>
<td><input type=”text” id=”email”></td>
</tr>
<tr>
<td>Address:</td>
<td><input type=”text” id=”address”></td>
</tr>
<tr>
<td>Gender:</td>
<td>
<input type=”radio” value=”Male” id=”gender”>
<label>Male</label>
<br>
<input type=”radio” value=”Female” id=”gender”>
<label>Female</label>
</td>
</tr>
<tr>
<td>Phone Number</td>
<td><input type=”text” id=”number”></td>

</tr>
</table>
</form>
</center>
</div>

</div>

<div class=”medical”>
<center>
<form>
<table id=”medical”>
<th>Medical Information</th>
<tr>
<td>Emergency Contact:</td>
<td><input type=”text” id=”emContact”></td>
<td>Guardian Contact:</td>
<td><input type=”text” type = “text”id=”contact”> </td>
</tr>
<tr>
<td>Insurance Carrier:</td>
<td><input type=”text” id=”insurance”></td>
<td>Policy:</td>
<td><input type=”text” id=”policy”></td>
</tr>

</table>

<input type=”submit” id = “submit” value=”Submit”>


</form>
</center>
</div>

</body>
</html>

You might also like