Sie sind auf Seite 1von 53

PRACTICAL FILE

ON

“COMPUTER APPLICATIONS-II”

Submitted in partial fulfilment of the requirement for the award


of the degree of BACHELOR OF BUSINESS ADMINISTRATION
To

GURU GOBIND SINGH INDRAPRASTHAUNIVERSITY

SUPERVISED BY: - SUBMITTED BY:


Mr. Shailendra kumar Nisha Sharma
ROLL NO: - 04710551713

NEW DELHI INSTITUTE OF MANAGEMENT


61, TUGHLAKABAD, NEW DELHI-62
ACKNOWLEDGEMENT

Any accomplishment requires the effort of many people and this work is not
different. Regardless of the source, I wish to express my gratitude to those
who may have contributed to this work, even though anonymously.

First I would like to express my deepest sense of gratitude to NEW DELHI


INSTITUTE OF MANAGEMENT for providing me an opportunity to conduct this
work.

I would like to pay my sincere thanks to my computer applications II guide,


Mr. Shailendra kumar, New Delhi Institute of Management, under whose
guidance I was able to complete my project successfully. I have been
fortunate enough to get all the support, encouragement and guidance from
him needed to explore, think new and initiate.

My final thanks go out to my parents, family members, teachers and friends


who encouraged me countless times to persevere through this entire
process.

NISHA SHARMA

~2~
CERTIFICATE

This is to certify that the practical file titled “COMPUTER APLLICATIONS-II”


submitted by NISHA SHARMA to New Delhi Institute of Management, Guru
Gobind Singh Indraprastha University, Delhi in partial fulfillment of
requirement for the award of the Bachelor of Business Administration degree
is an original piece of work carried out under my guidance and may be
submitted for evaluation. The assistance rendered during the study has been
duly acknowledged. No part of this work has been submitted for any other
degree.

Place: New Delhi Faculty Guide :


Dated: Mr. Shailendra kumar

INDEX

S.no. Topic Page no. Teacher’s


Sign.
1. Introduction to HTML 5

~3~
2. HTML code to change the Font Color 7
and size of webpage.
3. HTML code to demonstrate: 9
A) Ordered List.
B) Unordered list.
4. HTML code to insert an image in the 11
webpage.

5. HTML code to design tables with 12


different styles.

6. HTML code to design Anchor Tag. 17

7. HTML code to design Sign Up Form. 19

8. HTML code to design an online 23


reservation form.

9. HTML code to design Personal 26


Profile.
10. HTML code to design a webpage for 30
insurance policies.

11. HTML code to design an online 33


shopping form.

12. HTML code to design a webpage of 36


a “FOOD CORNER”.

13. HTML code to design a Website. 38

14 HTML code for application of CSS 50

INTRODUCTION TO HTML

Hyper Text Markup Language, commonly referred to as HTML, is the


standard markup language used to create web pages. It is written in the form
of HTML elements consisting of tags enclosed in angle brackets (like <html>).

~4~
HTML tags most commonly come in pairs like <h1> and </h1>, although some
tags represent empty elements and so are unpaired, for example <img>.

The first tag in a pair is the start tag, and the second tag is the end tag (they are
also called opening tags and closing tags).

Web browsers can read HTML files and compose them into visible or audible web
pages. Browsers do not display the HTML tags and scripts, but use them to
interpret the content of the page. HTML describes the structure of
a website semantically along with cues for presentation, making it a markup
language, rather than a programming language.

HTML elements form the building blocks of all websites. HTML allows images and
objects to be embedded and can be used to create interactive forms. It provides a
means to create structured documents by denoting structural semantics for text
such as headings, paragraphs, lists, links, quotes and other items. It can
embed scripts written in languages such as JavaScript which affect the behaviour of
HTML web pages.

Web browsers can also refer to Cascading Style Sheets (CSS) to define the look and
layout of text and other material. The World Wide Web Consortium (W3C),
maintainer of both the HTML and the CSS standards, encourages the use of CSS
over explicit presentational HTML.

HTML is a markup language that web browsers use to interpret and compose text,
images and other material into visual or audible web pages. Default characteristics
for every item of HTML markup are defined in the browser, and these
characteristics can be altered or enhanced by the web page designer's additional
use of CSS.

Many of the text elements are found in the 1988 ISO technical report TR
9537 Techniques for using SGML, which in turn covers the features of early text
formatting languages such as that used by the RUNOFF command developed in the
early 1960s for the CTSS (Compatible Time-Sharing System) operating system:
these formatting commands were derived from the commands used by typesetters
to manually format documents.

However, the SGML concept of generalized markup is based on elements (nested


annotated ranges with attributes) rather than merely print effects, with also the
separation of structure and markup; HTML has been progressively moved in this
direction with CSS.

HTML documents imply a structure of nested HTML elements. These are indicated in
the document by HTML tags, enclosed in angle brackets thus: <p>

~5~
In the simple, general case, the extent of an element is indicated by a pair of tags:
a "start tag" <p> and "end tag" </p>. The text content of the element, if any, is
placed between these tags.

Tags may also enclose further tag markup between the start and end, including a
mixture of tags and text. This indicates further, nested, elements, as children of the
parent element.

The start tag may also include attributes within the tag. These indicate other
information, such as identifiers for sections within the document, identifiers used to
bind style information to the presentation of the document, and for some tags such
as the <img> used to embed images, the reference to the image resource.

Some elements, such as the line break <br>, do not permit any embedded content,
either text or further tags. These require only a single empty tag (akin to a start
tag) and do not use an end tag.

Many tags, particularly the closing end tag for the very commonly-used
paragraph element <p>, are optional. An HTML browser or other agent can
infer the closure for the end of an element from the context and the
structural rules defined by the HTML standard. These rules are complex and
not widely understood by most HTML coders.

Q1. Write the code in HTML to change font color and size of the
webpage.

CODING

<html>

<head>

<title> change the font, colour and size of a web page. </title></head>

<body bgcolor = "yellow">


~6~
<h1 font color="white" face ="arial" size ="12"><u><b> <marquee
bgcolor="green" direction="left" loop= "5">DOMESTIC VOILENCE..!!
</marquee></b></u></font></h1>

<br><br>

<h2 font color="brown" face="arial" size="9"><u><b><i><marquee bgcolor =


"white" direction = "right" loop="4"> NATIONAL INTEGRATION
</marquee></b></u></font></h1>

<br><br><br><br>

<b><font color="black" face="arial black" size="4">Domestic violence (also


domestic abuse, spousal abuse, intimate partner violence, battering or family
violence) is a pattern of behavior which involves violence or other abuse by one
person in a domestic context against another, such as in marriage or cohabitation.
Intimate partner violence is domestic violence by a spouse or partner in an intimate
relationship against the other spouse or partner. Domestic violence can take place
in heterosexual or same-sex relationships. Domestic violence can take a number of
forms including physical, emotional, verbal, economic and sexual abuse, which can
range from subtle, coercive forms to marital rape and to violent physical abuse that
results in disfigurement or death.

Globally, a wife or female partner is more commonly the victim of domestic


violence, though the victim can also be the male partner, or both partners may
engage in abusive or violent behavior, or the victim may act in self-defense or
retaliation.</font></b>

</body>

</html>

OUTPUT

~7~
Q.2. Write the code in HTML to demonstrate the use of:
~8~
A) Ordered Lists

B) Unordered Lists

Coding
<html>

<head>

<title>the use of ordered list and unordered list.</title> </head>

<body bgcolor = pink>

<h1 font color = "violet" face = "arial"><u><b><marquee bgcolor=maroon


direction=left loop=7> CURRENT ISSUES </marquee>

</u></b></font></h1>

<font size = "6" face = "times new roman">

<ol type = "1" start = "1">

<li><font color = "blue"> POVERTY </font>

<li><font color = "purple"> DOWRY SYSTEM </font>

<li><font color = "green"> UNEMPLOYMENT </font>

<li><font color = "teal">TERRORISM </font>

<li><font color = "red">COMMUNAL DISTURBANCES</font>

<ul type = "fillround">

<li><font color = "aqua">RELIGION</font>

<li><font color = "lime">CASTE</font>

<li><font color = "yellow">CREED</font>

<li><font color = "lime">COLOUR</font>

<li><font color = "blue">INTEGRATION OF THE COMMUNITY </font>

<li><font color = "red"> POPULATION </font> </li></ul>

~9~
<li><font color = "green"> WOMEN EDUCATION </font>

<li><font color = "orange"> RISING PRICES </font></li></ol>

</body>

<html>

OUTPUT

Q.3. Write the code in HTML to demonstrate how to insert an image in


webpage.

~ 10 ~
CODING

<html>

<head>

<title>IMAGE</title></head>

<body bgcolor="green">

<center><img src="image1.jpg" width="600" height="400" align="top">

<p>this text aligned with the top of image</p>

</body>

</html>

OUTPUT

Q.4. Write HTML codes to design tables of different styles.

A) Table with border 16

~ 11 ~
CODING

<br><br>

<center><TABLE BORDER=16>

<TR><TD> Name </TD>

<TD> Year </TD>

<TD> Section </TD>

<TD> Course </TD>

<TD> Mobile no. </TD></TR>

<TR><TD> Nisha </TD>

<TD> 2nd year </TD>

<TD> A </TD>

<TD> BBA </TD>

<TD> 9650283585 </TD></TR>

<TR><TD>Akanksha </TD>

<TD> 3rd year </TD>

<TD> B </TD>

<TD> BMS </TD>

<TD> 9562252521 </TD></TR>

<TR><TD> Priyanka </TD>

<TD> 1st year </TD>

<TD> C </TD>

<TD> Btech </TD>

<TD> 9566984531</TD></TR>

OUTPUT

~ 12 ~
B) Table with Headings and background color

CODING

<br><br>

<center><table border=20 bgcolor ="red">

<tr><th> Name </th>

<th> Section </th>

<th> Course </th>

<th> Duration </th></tr>

<TR><TD> Nisha </TD>

<TD> A </TD>

<TD> BBA </TD>

~ 13 ~
<TD> 3 years</TD></tr>

<TR><TD>Akanksha </TD>

<TD> B </TD>

<TD> PGDBM </TD>

<TD> 2 years </TD></tr>

<TR><TD> Priyanka </TD>

<TD> C </TD>

<TD> MBBS </TD>

<TD> 5 years</TD></TR></table>

OUTPUT

C) Row Span

~ 14 ~
CODING

<HTML>

<HEAD>EXAMPLE OF SPANNING ROW

<TITLE>HOMEPAGE</TITLE>

</HEAD>

<BODY bgcolor="ORANGE">

<TABLE BORDER="2", ALIGN="CENTER", WIDTH="80%", bgcolor="PINK">

<CAPTION><H2>STUDENT DETAILS</H2>

</CAPTION>

<TH ROWSPAN="6">STUDENT NAME<BR>WITH<BR>DATE OF


BIRTH<BR>AND<BR>ADDRESS</TH>

<TR><TD>SUMIT</TD>

<TD>20-1-1995</TD>

<TD>FLAT NUMBER 85</TD></TR>

<TR><TD>NISHA</TD>

<TD>13-12-1995</TD>

<TD>KHANPUR</TD></TR>

<TR><TD>AKANKSHA</TD>

<TD>23-7-1995</TD>

<TD>JAWAHAR PARK</TD></TR>

<TR><TD>PRIYANKA</TD>

<TD>23-7-1995</TD>

<TD>MEETHAPUR</TD></TR>

<TR><TD>MEENAKSHI</TD>

<TD>2-2-1995</TD>

<TD>NOIDA</TD></TR>
~ 15 ~
</BODY>

</HTML>

OUTPUT

Q5. Design the use of Anchor tag.

Coding

<HTML>
~ 16 ~
<HEAD>

<TITLE>UNIVERSITY </TITLE>

</HEAD>

<BODY>

<h1>DELHI UNIVERSITY </h1>

<hr><br><b><font color="black" face="arial" size="5">Indraprastha univrsity is


a famous university in <a href="university.html">delhi</a> and Maharaja Agrasen
College and Maharaja Surajmal Institute of are considered as best colleges of this
university <a href= "college.html">about colleges</a></font></b><br>

</body>

</html>

OUTPUT

 University.html

<HTML>

<HEAD>

<TITLE>university </TITLE></HEAD>
~ 17 ~
<BODY>

<h1>delhi university </h1>

<hr><br><b><font color="black" face="arial" size="5">The North Campus has 16


faculties and 84 department. It hosts the three original colleges which constituted
the University of Delhi when it was founded: St. Stephen's College (founded 1881),
Hindu College (founded 1899) and Ramjas College (founded 1917) North campus
proper now has nine colleges geographically centred on the Faculty of Arts and
Science and the Faculty of Law. <a href=”college.html>college
information</a></font></b><br>

</body>

</html>

OUTPUT

Q.6.Write HTML code to design a sign up form.

CODING

<html>

<head>

~ 18 ~
<title>Registration</title></head>

<body BGCOLOR="PINK">

<h1>Sign up Form</h1><hr size=4>

Hi there!

We'll get you set up on Yahoo! in three easy steps! Just answer a few simple
questions, select an ID and password, and you'll be all set.

<form>

First Name:

<input type="Text"name="First Name"><br>

Last Name:

<input type="Text"name="Last Name"><br>

Gender:

<select name="gender">

<option>choose one</option>

<option>Male</option>

<option>Female</option>

</select><br>

Birthday:

<select name="month">

<option>select month</option>

<option>January</option>

<option>February</option>

<option>March</option>

<option>April</option>

<option>May</option>

<option>June</option>
~ 19 ~
<option>July</option>

<option>August</option>

<option>September</option>

<option>October</option>

<option>November</option>

<option>December</option>

</select>DAY:

<input type="number"size="2"maxlength="2">

Year:

<input type="number"size="4"maxlength="4"><br>

Country:

<input type="memo"size="25"maxlength="25"><br>

Postal Code:

<input type="number"size="6"maxlength="6"><br>

Yahoo! ID and Email:

<input type="memo"size="25"maxlength="25"@yahoo.com><br>

Password:

<input type="memo"size="10"maxlength="10"><br>

Re-Type Your Password:

<input type="memo"size="10"maxlength="10"><br>

Alternate Email:

<input type="memo"size="50"maxlength="50"><br>

Security Question:

<select name=" Security Question">

<option>-select one-</option>

~ 20 ~
<option>What is your pet's name?</option>

<option>What is your favourite dish?</option>

<option>Where did you meet your spouse?</option>

<option>Who is your favourite actor/actress?</option>

<option>What was the name of your first school?</option>

<option>Who was your childhood hero?</option>

<option>Do you pray?</option>

</select><br>

Your Answer:

<input type="memo"size="40"maxlength="40"><br>

Do you agree?:

I have read and agree to the Terms of Service.

<input type="checkbox"><br>

<FONT SIZE="5"COLOR="BLUE"><I>WRITE ABOUT YOUR


SELF</I></FONT><BR>

<textarea cols="40" rows="5" name="myname">

Now we are inside the area - which is nice.

</textarea>

<CENTER>

<INPUT TYPE = "button" VALUE="Submit">

<INPUT TYPE = "reset" VALUE="Clear form">

</CENTER></FORM>

</BODY>

</HTML>

OUTPUT

~ 21 ~
Q.7. Write an HTML code to Design an Online Reservation Form.

CODING

<html>

<head>

<title> ONLINE RESERVATION FORM.</title></head>

<body bgcolor="PINK">
~ 22 ~
<font size=7 font color="RED">

<center><b><u><i>

ONLINE RESERVATION FORM

</b></u></i></center></font><br><br>

<table>

<tr>

<td><b><font size=4 font color="blue">DATE</td><td><INPUT TYPE="text"


NAME="dd" value="date">

<INPUT TYPE="text" NAME="mm" value="month">

<INPUT TYPE="text" NAME="yy" value="year">

</td>

</tr>

<tr>

<td><b><font size=4 font color="blue">FROM</td><td><INPUT TYPE="text"


NAME="PO" value="" style="width:200px;"></td></tr>

<tr>

<td><b><font size=4 font color="blue">TO</td><td><INPUT TYPE="text"


NAME="PO" value="" style="width:200px;"></td></tr>

<tr>

<td><b><font size=4 font color="blue">CLASS</td><td>

<select>

<option>Select Class</option>

<option>First Class AC(1A)</option>

<option>First Class (FC)</option>

<option>AC 2-TIER SLEEPER(2A) </option>

<option> AC CHAIR CAR(CC)</option>

~ 23 ~
<option> SLEEPER CLASS(SL)</option>

</select>

</td></tr>

<tr><td><b><font size=4 font color="blue">TRAIN NAME</td><td><INPUT


TYPE="text" value="" style="width:200px;"></td></tr>

<tr><td><b><font size=4 font color="blue">TRAIN NO.</td><td><INPUT


TYPE="text" value="" style="width:200px;"></td></tr>

</table><br><br>

<b><u>PAYMENT VIA:</b></u>

<input type=radio name="a" value="cash on delivery"> CASH ON DELIVERY

<input type=radio name="b" value="credit card"> CREDIT CARD</form>

<br><br>

<b><u>TICKET TYPE:</b></u>

<input type=radio name="ticket type" value="i-ticket">I-TICKET

<input type=radio name="ticket type" value="e-ticket">E-TICKET

<br>

<br>

<br>

<br>

<center><form>

<input type="button" value="ACCEPT">

<input type="button" value="CANCEL">

</body>

</html>

OUTPUT

~ 24 ~
Q.8.Write HTML code to design a personal profile.

CODING

<HTML>

<HEAD>

<TITLE>PROFILE</TITLE></HEAD>

<BODY BGCOLOR="ORANGE">
~ 25 ~
<H1>PERSONAL PROFILE</H1><HR SIZE="6"><BR><BR>

<FORM>

NAME:

<INPUT TYPE="TEXT" NAME="MYNAME"><BR>

BIRTHDAY:

<SELECT NAME="MONTH">

<OPTION>SELECT MONTH</OPTION>

<OPTION> JANUARY</OPTION>

<OPTION>FEBRUARY</OPTION>

<OPTION> MARCH</OPTION>

<OPTION>APRIL</OPTION>

<OPTION> MAY</OPTION>

<OPTION> JUNE</OPTION>

<OPTION> JULY</OPTION>

<OPTION> AUGUST</OPTION>

<OPTION>SEPTEMBER</OPTION>

<OPTION>OCTOBER</OPTION>

<OPTION>NOVEMBER</OPTION>

<OPTION>DECEMBER</OPTION>

</SELECT>&nbsp DAY:

<INPUT TYPE="NUMBER" SIZE="2" MAXLENGTH="2">

YEAR:

<INPUT TYPE="NUMBER" SIZE="4" MAXLENGTH="4"><BR>

COUNTRY:

<INPUT TYPE="MEMO" SIZE="25" MAXLENGTH="25"><BR>

~ 26 ~
POSTAL CODE:

<INPUT TYPE="NUMBER" SIZE="6" MAXLENGTH="6"><BR>

ADDRESS:

<INPUT TYPE="MEMO" SIZE="40" MAXLENGTH="40"><BR>

OFFICE PHONE NUMBER:

<INPUT TYPE="NUMBER" SIZE="12" MAXLENGTH="12"><BR>

RESIDENCE NUMBER:

<INPUT TYPE="NUMBER" SIZE="12" MAXLENGTH="12"><BR>

MOBILE NUMBER:

<INPUT TYPE="NUMBER" SIZE="12" MAXLENGTH="12"><BR>

EMAIL:

<INPUT TYPE="MEMO" SIZE="50" MAXLENGTH="50"><BR>

FAX:

<INPUT TYPE="NUMBER" SIZE="12" MAXLENGTH="12"><BR>

PASSPORT NUMBER:

<INPUT TYPE="NUMBER" SIZE="18" MAXLENGTH="18"><BR>

DRIVING LICENSE NUMBER:

<INPUT TYPE="MEMO" SIZE="20" MAXLENGTH="20"><BR>

AADHAR CARD NUMBER:

<INPUT TYPE="MEMO" SIZE="20" MAXLENGTH="20"><BR>

INSURANCE POLICY NUMBER:

<INPUT TYPE="MEMO" SIZE="20" MAXLENGTH="20"><BR>

BLOOD GROUP:

<SELECT NAME="BLOOD GROUP">

<OPTION>SELECT ONE</OPTION>

~ 27 ~
<OPTION>'O' POSITIVE</OPTION>

<OPTION>'O' NEGATIVE</OPTION>

<OPTION>'A' POSITIVE</OPTION>

<OPTION>'AB' NEGATIVE</OPTION>

<OPTION>'A'NEAGTIVE</OPTION>

<OPTION>'AB' POSITIVE</OPTION>

<OPTION>'B'NEAGTIVE</OPTION></SELECT><BR>

INFORMATION ABOUT CREDIT CARD:

<SELECT NAME="CREDIT CARD">

<OPTION>SELECT ONE</OPTION>

<OPTION>AXIS BANK</OPTION>

<OPTION>ICICI BANK</OPTION>

<OPTION>YES BANK</OPTION>

<OPTION>HDFC BANK</OPTION>

<OPTION>DENA BANK</OPTION>

<OPTION>SBI</OPTION></SELECT>

</TEXTAREA><BR>

ABOUT MYSELF:<BR>

<TEXTAREA COLS="60" ROWS="6" NAME="MY NAME">

</TEXTAREA><BR><BR><CENTER>

<INPUT TYPE="BUTTON" VALUE="SUBMIT">

<INPUT TYPE="BUTTON" VALUE="CLEAR FORM">

</CENTER></FORM>

</BODY>

</HTML>

~ 28 ~
OUTPUT

Q.9.Write HTML code to design a homepage for “Insurance Policies”.

CODING

<html>

<head>

<title>homepage</title>

~ 29 ~
</head>

<body bgcolor="orange">

<font face="Verdana" size="6"> Metropolitan Health Insurance


Company</font><br>

<font face="verdana" Size="1">

--World's Largest New York based Health Insurance Company</font></p>

<p align="center">

<img src="C:\Users\Dhiraj Sharma\Desktop\metro.png" width="168"


height="214"> </p>

<p align="center"><font face="Verdana" size="2"><a


href="homepage.htm">Home</a> | <a href="about.html">About Us</a> | <a
href="schemes.html">Health Insurance Schemes</a> | <a
href="contact.html">Contact Us</a>

</font>

<p align="left"><b><font face="Verdana">What is Insurance?</font></b><br>

<font face="Franklin Gothic Medium" size="2"><b><span


lang="EN">Insurance</span></b><span lang="EN">,

in law and economics, is a form of risk management primarily used to hedge


against the risk of a contingent loss. Insurance is defined as the equitable transfer
of the risk of a loss, from one entity to another, in exchange for a premium.
<b>Insurer</b> is the company that sells the insurance.

<b>Insurance rate</b> is a factor used to determine the amount, called the


<b>premium</b>, to be charged for a certain amount of insurance coverage. Risk
management, the practice of appraising and controlling risk, has evolved as a
discrete field of study and practice.</span></font><p align="left"><span
class="cphdtxt">

<span style="font-family: Franklin Gothic Medium; font-weight: 700">

Finding Low Cost Health Insurance</span></span><span style="font-size: 12.0pt;


font-family: Times New Roman"><br>

</span><font face="Franklin Gothic Medium" size="2">Looking for a


comprehensive low cost health insurance is almost similar to looking for a gold
mine hidden in a secret cave. The rising health insurance costs are becoming such a
~ 30 ~
big problem today. Every person has the right to be assured of proper medical
attention. In effect, everybody definitely needs health insurance coverage. But then
again, providers are always faced with the constant battle of giving quality
coverage against the ever-increasing medical care, hospitalization, and health
maintenance costs. Health care insurance is so expensive nowadays because for
one, there have been big gains on medical science over the past few years. And
these new researches translate to a much better medical technology</font><span
style="font-size: 12.0pt; font-family: Times New Roman">.

</span><font face="Franklin Gothic Medium" size="2"><a href="read.htm">Read


more</a></font><br>

<h5>Author information goes here.<br>

Copyright © 2001. All rights reserved.<br>

Revised: <!--webbot bot="TimeStamp" s-type="EDITED" s-format="%m/%d/%y"


startspan -->04/18/08<!--webbot bot="TimeStamp" i-checksum="13372" endspan
-->.</h5>

</body>

</html>

OUTPUT

~ 31 ~
Q.10.Write HTML code to design an online shopping form.

~ 32 ~
CODING

<html>

<head></head>

<body bgcolor = "pink">

<form>

<center><p><Image src="shopping.jpg" width="600" height="100"></p>


</center>

<h1 align = center> <font face="Bookman Old Style">ONLINE SHOPPING


SITE</font></H1>

<img src= "shopping2.jpg" ALIGN = RIGHT alt="Undertaker"><br>

<font face="Bookman Old Style">First Name </font>

<input type = "text" value="" size="28" name="1"><br><br>

<font face="Bookman Old Style">Last Name </font>

<input type = "text" value="" size="28" name="11"><p>

<font face="Bookman Old Style">Address</font><br>

<textarea rows = 3 cols = 30 name="ADDRESS"></textarea><br>

<font face="Bookman Old Style">Phone </font>

<input type = "text" value = "" size="16" name="12">

<br><image src="shopping1.jpg" alt="Big Show Vs. Mark Henry" align="right">

<font face="Bookman Old Style"> items

<select>

<option> Choose among the Following...</option>

<option>grocerry</option>

<option>clothes</option>

<option>fotwear</option>

~ 33 ~
<option>jewellery</option>

</select><br>

Number of items purchased

<select>

<option>00</option>

<option>01</option><option>02</option>

<option>03</option><option>04</option><option>05</option></select><i>

<font size="2">If more than 5 please specify the number here</font></i>

<input type = "text" value = "" size="4" name="13"><br><BR>

Payment via<br>

<input type = radio value = "">Draft <br>

<input type = radio value = "">Credit Card </font>

</p>

<font face="Bookman Old Style"> Payment Details:</font><br>

<font face="Bookman Old Style">1.Draft is payable under the name of big


bazaar.</font><br>

<font face="Bookman Old Style">2.Credit card details:<br>

Credit card number <input type = "text" value = "" size="20"> </font>

<font face="Bookman Old Style"> of

<input type = "text" value = "" size="20" name="14">Company<BR>

<CENTER>

<input type = "button" value="Submit">

<input type = "Reset" >

</CENTER>

</form></font>

</body>
~ 34 ~
</html>

OUTPUT

Q.11.Write HTML code to design a webpage for a “Food Corner”.

CODING

<HTML>

~ 35 ~
<HEAD>A PLACE TO EAT THE HEART OUT

<TITLE>SOULS FACTION</TITLE></HEAD>

<IMG SRC="F:\html\food1.jpg" ALIGN=RIGHT WIDTH=200


HEIGHT=100>&nbsp<IMG SRC="F:\html\food2.jpg" ALIGN=RIGHT WIDTH=200
HEIGHT=100>

<BODY bgcolor="ORANGE">

<H1><U>INDIAN FOOD CORNER</U></H1><BR>

<center><IMG SRC="F:\html\food3.PNG" WIDTH=500 HEIGHT=100></center>

<P><H3>An unusual landmark in Reynella is what has become known colloquially


as Junk Food Junction or Junk Food Corner. At a time when the fast food market
was less saturated, the intersection of South Road, Adelaide and Pimpala Road had
all four major fast food outlets: McDonalds, Hungry Jacks, Pizza Hut and Kentucky
Fried Chicken. Currently on this intersection there is McDonalds, KFC, Hungry Jacks,
Fasta Pasta, Yiros King, Red Rock Noodle Bar, Domino's Pizza and a Caltex service
station. The derelict site of the former Pizza Hut building has attracted some local
controversy[when?] for the amount of time it has taken to
redevelop.</H3></P><center><img src="F:\html\food5.jpg" WIDTH=300
HEIGHT=100><img src="F:\html\food4.jpg" WIDTH=300 HEIGHT=100></center>

<H4>LIST OF FOOD</H4>

<OL START="1">

<Li>PIZZA</Li>

<Li>BURGER</Li>

<Li>SANDWICH</Li>

<Li>SPRINGROLL</Li>

<Li>MAGGI</Li></OL>

<A HREF=MENU></A>

</BODY>

</HTML>

OUTPUT

~ 36 ~
Q12. HTML codes for website of six pages.

Coding of 1st Page (About Batra Hospital)

<html>

<head>
~ 37 ~
<title>Batra Hospital</title></head>

<IMG SRC="F:\batra2.gif" ALIGN=left WIDTH=200 HEIGHT=100>&nbsp<IMG


SRC="F:\batra3.jpg" ALIGN=RIGHT WIDTH=300 HEIGHT=200>

<body bgcolor="orange"><br><br>

<h1><b><center>BATRA HOSPITAL</center></b></h1>

<h2><b><center>Health And Happiness For All</center></b></h2><br>

<center><a href=facility.html>Facilities</a>&nbsp&nbsp&nbsp<a
href=speciality.html>Speciality</a>&nbsp&nbsp&nbsp<a
href=international.html>International pateients</a>&nbsp&nbsp&nbsp<a
href=service.html>Services</a>&nbsp&nbsp&nbsp<a
href=empanelments.html>Empanelments</a></center>

<h2><b><u>About us </u></b></h2>

<p>The Hospital & Medical Research Centre was established in the year 1987 by
Ch. Aishi Ram Batra Public Charitable Trust. The Batra Hospital & Medical Research
Centre is located at Tughlakabad and is a 495 bedded facility with 14 Operation
Theatres, 112 ICU beds and 24x7 Emergency facilities. Shri DV Batra was a
Member of the Shri Mata Vaishno Devi Shrine Board which operates under the
Chairmanship of His Excellency the Governor of Jammu and Kashmir.

In 1996, the Jammu & Kashmir Government awarded him the Prestigious Gold
Medal at a special function presided over by the His Excellency the Governor of
Jammu & Kashmir. This is the Highest Civilian Award of the state of Jammu and
Kashmir.Besides he has rendered and continues to render services in various social,
religious and human welfare activities.</p>

<h3><b>Centres of excellence</b></h3>

<ol start="1">

<li>Batra Heart Centre</li>

<li>Batra Cancer Centre</li>

<li>Batra Neurosciences Centre</li>

<li>Batra Ortho & Joint Replacement Centre</li>

<li>Batra Gastrosciences Centre</l1>

<li>Department of Nephrology & Transplantation</li> <br><br><br><br>

~ 38 ~
</body></html>

OUTPUT

Coding of 2nd Page (Facility)

<html>

<head>

<title>Batra Hospital</title></head>

<IMG SRC="F:\batra2.gif" ALIGN=left WIDTH=200 HEIGHT=100>&nbsp<IMG


SRC="F:\batra3.jpg" ALIGN=RIGHT WIDTH=300 HEIGHT=200>

~ 39 ~
<body bgcolor="orange"><br><br>

<h1><b><center>BATRA HOSPITAL</center></b></h1>

<h2><b><center>Health And Happiness For All</center></b></h2><br>

<center><b><a href=batra.html>About us</a>&nbsp&nbsp&nbsp<a


href=speciality.html>Speciality</a>&nbsp&nbsp&nbsp<a
href=international.html>International pateients</a>&nbsp&nbsp&nbsp<a
href=service.html>Services</a>&nbsp&nbsp&nbsp<a
href=empanelments.html>Empanelments</a></b></center>

<h2><b><u>Facilities Of Batra Hospital</u></b></h2>

<center><IMG SRC="F:\batra4.jpg" ALIGN=center WIDTH=300


HEIGHT=100>&nbsp<IMG SRC="F:\batra5.jpg" ALIGN=center WIDTH=300
HEIGHT=100></center>

<ol start="1">

<li>The hospital is centrally air-conditioned and has a total bed capacity of 495
beds. The beds are divided into categories so that people from all segments of the
society can afford the room rates according to their budgets. The categories are:
Diplomat Deluxe, Diplomat, Super Deluxe/ VIP, Deluxe, Single Room, Semi Private
(2 Bedded/3 Bedded) and Multi-Sharing Room. The accommodation comes in the
options of A/C and Non-A/C.</li><br><br>

<li>The Hospital has 27 Bedded Medical ICU which has state-of-the-art monitoring
and ventilator facilities. There are separative Intensive Care Units for Cardiology,
Neurology, Medicine and Surgery. The ICU's are manned 24x7 by ICU Trained
Residents and In-House Consultants. The ICU has separate isolation rooms with
facilities for both positive and negative pressure chambers. The hospital has 24-
Bedded Intensive Care Unit with 24x7 monitoring especially for Post-Operative
Cardiac patients.</li><br><br>

<li>The hospital has state-of-the art and very well-equipped operation theatres.
Each OT is equipped with laminar airflow for air-conditioning with HEPA Filters. The
OT's have Imported dual dome OT lights, low flow anaesthesia machines with built
in ventilators and multi-parameter modular monitors. They also have separate Pre
and Post-Operative Area, Recovery Room and Surgical ICU . The units have their
own blood gas and electrolyte machines </li><br><br>

</body>

</html>

~ 40 ~
Output

Coding of 3rd Page (Speciality)

<html>

<head>

<title>Batra Hospital</title></head>

<IMG SRC="F:\batra2.gif" ALIGN=left WIDTH=200 HEIGHT=100>&nbsp<IMG


SRC="F:\batra3.jpg" ALIGN=RIGHT WIDTH=300 HEIGHT=200>

~ 41 ~
<body bgcolor="orange"><br>

<h1><b><center>BATRA HOSPITAL</center></b></h1>

<h2><b><center>Health And Happiness For All</center></b></h2><br>

<center><b><a href=batra.html>About us </a>&nbsp&nbsp&nbsp<a


href=facility.html>facilities</a>&nbsp&nbsp&nbsp<a
href=international.html>International pateients</a>&nbsp&nbsp&nbsp<a
href=service.html>Services</a>&nbsp&nbsp&nbsp<a
href=empanelments.html>Empanelments</a></b></center>

<h2><b><u>Speciality at Batra Hospital</u></b></h2>

<center><IMG SRC="F:\batra6.jpg" ALIGN=center WIDTH=400


HEIGHT=80>&nbsp<IMG SRC="F:\batra7.jpg" ALIGN=center WIDTH=400
HEIGHT=80></center>

<ol start="1">

<li>Centres of Excellence: Heart Centre: Cardiology, Interventional Cardiology and


Cardiac Surgery. Cancer Centre: Cancer Centre: Medical Oncology, Radiation
Oncology and Surgical Oncology. Neurosciences Centre</li>

<li>Medical Specialties: Anaesthesiology, Critical Care & Pain Clinic, Dermatology,


Endocrinology, Diabetology & Metabolic Medicine, Internal Medicine & Critical Care,
Psychiatry & Clinical Psychology, Paediatrics</li><br>

<center><IMG SRC="F:\batra8.jpg" ALIGN=center WIDTH=400


HEIGHT=80>&nbsp<IMG SRC="F:\batra9.jpg" ALIGN=center WIDTH=400
HEIGHT=80></center><br>

<li>Surgical Specialties: Body & Neuro Interventional Radiology, Arthroscopic


Surgery & Orthopaedics Sports Medicine, Dental Science, ENT, General Surgery &
Laparoscopic (Minimal Access) Surgery</li>

<li>Diagnostic Specialties: Laboratory Medicine, Nuclear Medicine and Radiology &


Imaging. Alternate Medicine: Acupuncture, Ayurveda and Homoeopathic Medicine.
Support Services: Department Of Dietetics</li><br>

</body>

</html>

Output

~ 42 ~
Coding of 4th Page (International Patients)

<html>

<head>

<title>Batra Hospital</title></head>

<IMG SRC="F:\batra2.gif" ALIGN=left WIDTH=200 HEIGHT=100>&nbsp<IMG


SRC="F:\batra3.jpg" ALIGN=RIGHT WIDTH=300 HEIGHT=200>

~ 43 ~
<body bgcolor="orange"><br><br>

<h1><b><center>BATRA HOSPITAL</center></b></h1>

<h2><b><center>Health And Happiness For All</center></b></h2><br>

<center><b><a href=batra.html>About us</a>&nbsp&nbsp&nbsp<a


href=facility.html>Facilities</a>&nbsp&nbsp&nbsp<a
href=speciality.html>Speciality</a>&nbsp&nbsp&nbsp<a
href=service.html>Services</a>&nbsp&nbsp&nbsp<a
href=empanelments.html>Empanelments</a></b></center>

<h2><b><u> International Patients </u></b></h2>

<ol start="1">

<li><b><u>Exclusive Services:</u></b>The skills of our Medical Professionals


are enriched with international experience. This is in line with the continuing ethos
of the hospital to combine the best medical care with warmth and tenderness which
is essential to the healing process.

<b><u>Pre departure services</u></b>

<ul start="fill round">

<li>Tele-consultation and Pre Departure Evaluation</li>

<li>Facilitate Travel arrangements</li>

<li>Visa Services</li>

<li>Hotel Booking (Budget, Deluxe and Luxury Hotels)</li>

<li>Airport Transfers</li>

<li>Bedside admission in the Hospital</li></ul>

<li><b><u>Post admission services:</u></b></li>

<ul start="fill round">

<li>Centrally air-conditioned hospital</li>

<li>Choice of rooms from private to luxury suites</li>

<li>Interpreters in select languages (Arabic, French, Spanish)</li>

<li>Mobile Phones for easy access and communication</li>

~ 44 ~
<li>Wi Fi enabled suites</li></ul></ol>

</body></html>

Output

Coding of 5th Page (Services)

<html>

<head>

<title>Batra Hospital</title></head>

<IMG SRC="F:\batra2.gif" ALIGN=left WIDTH=200 HEIGHT=100>&nbsp<IMG


SRC="F:\batra3.jpg" ALIGN=RIGHT WIDTH=300 HEIGHT=200>

<body bgcolor="orange"><br><br>
~ 45 ~
<h1><b><center>BATRA HOSPITAL</center></b></h1>

<h2><b><center>Health And Happiness For All</center></b></h2><br>

<center><b><a href=batra.html> About us </a>&nbsp&nbsp&nbsp<a


href=facility.html>Facilities</a>&nbsp&nbsp&nbsp<a
href=speciality.html>Speciality</a>&nbsp&nbsp&nbsp<a
href=international.html>International pateients</a>&nbsp&nbsp&nbsp<a
href=empanelments.html>Empanelments</a></b></center>

<h2><b><u> Services </u></b></h2>

<ol start="1">

<li><b><u>Pharmacy:</u></b>A leading pharmacy with Retail Pharmacy 24/7


with all kinds of Allopathic, Surgical, and Cosmetics stocked in.

We take immense pleasure to introduce ourselves as one of the biggest pharmacy


with well trained staff and a registered pharmacist available full time to serve
you.</li>

<br><li><b><u>Blood Bank:</u></b>Batra Hospital has its own Blood Bank


which runs 24 hrs x 365 days. Where blood and blood components are stored under
ideal conditions with temperature control and alarm facilities, following stringent
screening procedures. The Blood Bank accepts blood on a voluntary donor/
replacement basis only. Blood donation is undertaken during all working days from
9 am to 4.30 pm.</li>

<br><li><b><u>Guest House:</u></b>For comfortable stay for the accomplice


of the patients the hospital has made provision for guest rooms. The Guest House is
located within the hospital campus and are very economically priced. The
attendants can choose between A/Ced and Non-A/Ced accommodation.</li>

<br><li><b><u>Ambulance:</u></b>Well equipped ACLS and BLS ambulances


are available round the clock to cater any type of emergencies.The following
telephone numbers may be contacted for Ambulance Services:</li>

<ul start="fill square">

<li>Critical Care Ambulance<br>

(Tel: 011-29958747, Extn : 3056)</li>

<li>Cardiac Ambulance<br>

(Tel: 011-29958747, Extn: 2085)</li></ul></ol>

~ 46 ~
</body></html>

Output

Coding of 6th Page (Empanelments)

<html>

<head>

<title>Batra Hospital</title></head>

<IMG SRC="F:\batra2.gif" ALIGN=left WIDTH=200 HEIGHT=100>&nbsp<IMG


SRC="F:\batra3.jpg" ALIGN=RIGHT WIDTH=300 HEIGHT=200>

<body bgcolor="orange"><br><br>

<h1><b><center>BATRA HOSPITAL</center></b></h1>

~ 47 ~
<h2><b><center>Health And Happiness For All</center></b></h2><br>

<center><b><a href=batra.html>About us</a>&nbsp&nbsp&nbsp<a


href=facility.html>Facilities</a>&nbsp&nbsp&nbsp<a
href=speciality.html>Speciality</a>&nbsp&nbsp&nbsp<a
href=international.html>International pateients</a>&nbsp&nbsp&nbsp<a
href=service.html>Services</a></b></center>

<h2><b><u>Empanelments</u></b></h2>

<ol start="1">

<li>corporate</li>

<ul start="fill round">

<li>The Claridges</li><img src="C:\Users\Dhiraj Sharma\Desktop\image1.jpg"


width="200" height="80" align="right">

<li>Delhi metro</li>

<li>Icon</li>

<li>Hero honda</li></ul>

<li>PSU</li>

<ul start="fill round">

<li>BHEL</li><img src="C:\Users\Dhiraj Sharma\Desktop\image11.jpg"


width="200" height="80" align="right">

<li>Air India</li>

<li>Bharat petroleum</li>

<li>Bharat Electronics</li></ol>

<li>Insurance & TPAs</li>

<ul start="fill round">

<li>Alankit</li><img src="C:\Users\Dhiraj Sharma\Desktop\image12.jpg"


width="200" height="80" align="right">

<li>E-meditek</li>

<li>DHS</li>

~ 48 ~
<li>Genins India TPA Ltd</li></ul></ol>

</body></html>

Output

Q13.HTML code for application of CSS.

Coding
<html>

<head>

<style>

h1 {

background-color: #6495ed;

}
~ 49 ~
p{

background-color: #e0ffff;

div {

background-color: #b0c4de;

</style>

</head>

<body>

<h1>CSS background-color example!</h1>

<div>

This is a text inside a div element.

<p>This paragraph has its own background color.</p>

We are still in the div element.

</div>

</body>

</html>

Output

~ 50 ~
Coding
~ 51 ~
<html>

<head>

<style>

.center {

text-align: center;

color: red;

</style>

</head>

<body bgcolor="black">

<h1 class="center">Red and center-aligned heading</h1>

<p class="center">Red and center-aligned paragraph.</p>

</body>

</html>

Output

~ 52 ~
~ 53 ~