Вы находитесь на странице: 1из 35

Q1.

Give the introduction to the HTML with its advantages and


disadvantages and also describe the main structure of HTML.

HTML stands for Hyper Text Markup Language. Its file extension is (.html or
.htm). HTML5 is the latest evolution of the standard that defines HTML. Its
initial release is in 1993. It consists of a series of codes used to structure texts,
images and other content to be displayed in a browser.

It is used to design web pages using markup language. HTML is the


combination of Hypertext and Markup language. Hypertext defines the link
between the web pages. Markup language is used to define the text document
within tag which defines the structure of web pages.

HTML is a markup language which is used by the browser to manipulate text,


images and other content to display it in required format. HTML was created by
Tim Berners-Lee in 1991.

Elements, tags and attributes are basic concepts in HTML. HTML element is a
main structural unit of a web page. HTML tags are used to define HTML
elements, and attributes provide additional information about these elements.
HTML uses predefined tags and elements which tells the browser about content
display property. If a tag is not closed the browser applies that effect till end of
page.
Tag element

<b>Hyper Text Markup Language</b>

Opening Tag Closing Tag

Originally, HTMLwas developed with the intent of defining the structure of


documents like heading, paragraphs, lists and so forth to facilitate the sharing of
scientific information between researchers. Now, HTML is being widely used to
format web pages with the help of different tags available in HTML language.

This language is used to annotate (make notes for the computer) text so that a
machine can understand it and manipulate text accordingly. Most of the markup
language (HTML) are human readable.
Features of HTML:
 It is easy to learn and easy to use.
 It is a platform independent.
 Images, video and audio can be added to a web page.
 Hypertext can be added to text.
 It is a markup language.

Advantages of HTML:
 HTML is free for all: One of the biggest advantages of HTML is that it
is free of cost, and there is no need to purchase specific software.
Everyone can learn HTML language. So you can easily optimize your
site.
 HTML is simple to understand and use: HTML is simple to
understand and use; one does not need to have any prior knowledge of
any language. You needed to learn Basic English. All most all developer
is familiar with HTML. This language is for basic programmers.
 HTML is easy to edit: HTML is a simple language to edit. It does not
need any platform. Html is written in simple Notepad and Notepad++,
etc.
 HTML is supported by all browsers: The best advantage of HTML is it
supported all web browsers. It is supported by more browsers than any
other programming language. So there is no need to worry about the
website written in HTML. Also, it is easy to optimize using HTML.
 HTML is basic of all programming languages: HTML is basic of all
programming languages for the programmers. You need to know basic
HTML knowledge. It is very easier than other programming languages
like JavaScript, Php, etc.
 HTML is most search-friendly programming language: HTML is the
most friendly programming language of all programming languages that
are available in the market today. Html helps you to rank on Google’s
first page. It is easier for web crawlers to read and crawl using HTML. It
also reduced the page load time of your site.
Disadvantages of HTML:

 Write a lot of code: Html is simple than other programming languages but
it has taken a lot of words to create a simple webpage.
 Take a lot of time: Html is easy to write, but it has taken a lot of time to
write a webpage.
 Difficult to found mistake: when you write a simple webpage, and it does
not open. It will be difficult o find out the problem.
 Not Centralized: Html is not centralized it means all the pages must be
edited individually.
 Complexity: If we need to write a long code for making a webpage then it
produces some complexity.
 Other disadvantages are:-
 Html can create only static and plain pages do if we need dynamic
pages then HTML is not useful.
 Security features are not good at HTML.
 It is not really flexible as other standards and technologies.
 Very limited styling capabilities.

Creating HTML Document:


Creating an HTML document is easy. To begin coding HTML you need only
two things: a simple-text editor and a web browser. Notepad is the most basic of
simple-text editors and you will probably code a fair amount of HTML with it.

 Open Notepad or another text editor.


 At the top of the page type <html>.
 On the next line, add the opening header tag <head>.
 Then add <title> and written a title and close the tag </title>.
 Go to the next line, indent spaces from the margin and insert the closing
header tag</head>.
 On the next line begin with <body> tag.
 Now drop down another line and type the closing tag </body>.
 Finally , go to the next line and type</html>
 In the File menu, choose Save As , name the file template(.html)
 Click Save.
MAIN STRUCTURE OF HTML

 <HTML> Tag: - It is a tag used to start and end the HTML document.
Html tag is a container tag. This is the outermost style element, which
represents the document as a whole.
 <HEAD> Tag: - Within the <html> tags there are two major areas,
controlled by <head> and <body> elements. The first of these <head> tag
is used for storing metadata for the document, such as the properties title
and other information that is not actually seen by the end user. It is also a
container tag.
 <TITLE> Tag: - It is used to define the title of the webpage or HTML
document. The contents of this tag are displayed at the top of the web
browser. It is also a container tag.
 <BODY> Tag: - The second major area within <html> tags is the main
<body> tag. They are the container that holds the various pieces of
content that the end user sees in the output. It is used to define the body
parts of the hypertext document. It is also a container tag. Under <body>
tag it contains certain sub-element tags like <b>, <u>, <pre>, <p>, <h1>,
<centre> tags etc which will help you to modify the webpage.
Example:-

Main part
Body part

1. Then go to file menu> choose Save As.


2. Save the file with extension .html
3. Click Save.
4. Open the document and see the results:-

Title of HTML program

Body: content of the


web page.
Q3. Design a web document in HTML to implement the colour.

In order to implement the colour in your web document, we will use bgcolour
attribute. It is used to set the background colour of an HTML element. It
specifies a colour for the HTML document to display.

SYNTAX:- <body bgcolour =”colour”> the colour value can either be a colour
name( like purple )or a hex value (like #af0000).

Coding for bgcolour:-

<HTML>

<HEAD>

<TITLE> bgcolour attribute </TITLE>

<BODY bgcolour= “yellow”>

<h1> This webpage has a colored background. </h1>

</BODY>

</HTML>

1. Then go to file menu> choose Save As.


2. Save the file with extension .html
3. Click Save.
4. Open the document and see the results:-

Result:-

Now the background of the web page is in yellow using bgcolour attribute.
Q4. Design a web document in HTML to implement the scripts and
formatted text also.

In HTML there are mainly 2 types of scripts used:-

SCRIPTS IN HTML

SUBSCRIPT SUPERSCRIPT

SUBSCRPIT: - The <sub> tag is used to add a subscript text to the HTML
document. Subscript text appears half a character is below the normal line and is
sometimes rendered in a smaller font. Subscript text can be used for chemical
formulas like H20.

SUPERSCRPIT: - The <sup> tag is used to add a superscript text to the


HTML document. Superscript text appears half a character is above the normal
line and is sometimes rendered in a smaller font. It can be used for writing
number like 2nd.

Coding for subscript:-

<HTML>

<HEAD>

<TITLE> SUBSCRIPT </TITLE>

</HEAD>

<BODY>

<H3> Subscript </H3>

<H2> The chemical formula of Starch is = C <sub> 6</sub> H <sub> 10</sub>


O <sub> 5 </sub> </H2>

</BODY>

</HTML>
1. Then go to file menu> choose Save As.
2. Save the file with extension .html
3. Click Save.
4. Open the document and see the results:-

Result:-

Here, half a character is below the normal line and is sometimes rendered in a
smaller font due to <sub> tag.

Coding for superscript:-

<HTML>

<HEAD>

<TITLE> SUPERSCRIPT </TITLE>

</HEAD>

<BODY>

<H3> Superscript </H3>

<H2> Mathematical formula = (a+b) <sup>2</sup>= a <sup> 2</sup> + 2ab +


b<sup> 2</sup> </H2>

</BODY>

</HTML>
1. Then go to file menu> choose Save As.
2. Save the file with extension .html
3. Click Save.
4. Open the document and see the results:-

Result:-

Here, half a character is above the normal line and is sometimes rendered in a
smaller font due to <sup> tag.

FORMATTING OF TEXT:- it is a process of formatting text for better look


and feel. In HTML the formatting tags are divided in to two categories:

1. Physical Tag: they provide the visual appearance to the text.


2. Logical Tag: they ate used to add some logical or semantic value to the
text.

Here under this question, 6 tags are used for formatting the text in web
document.

FORMATTING OF TEXT

BOLD UNDERLINE ITALIC PREFORMATTED STRONG EMPHASIS

TAG
BOLD: <b> tag is used to represents bold text in an HTML document. It is a
container tag </b>.
UNDERLINE: <u> tag in HTML stands for underline and it is used to
underline the text enclosed within the <u> tag. . It is a container tag </u>.

ITALIC: <i> tag is used to italicise the text. It opens with <i> and ends with
</i> tag.

PREFORMATTED: <pre> element represents preformatted text which is


presented exactly as written in the HTML file. It is a container tag </pre>.

STRONG: <strong> tag is used to define important text. . It is a container tag


</strong>.

EMPHASIS: <em> tag is a phrase tag. It renders as emphasized text. It is a


container tag </em>.

Coding for formatted text:-

<HTML>

<HEAD>

<TITLE> FORMATTED TEXT </TITLE>

</HEAD>

<BODY>

<P><H3> BOLD TAG </H3>

<H4><B> E-commerce is doing business electronically </B></H4>

<H3> UNDERLINE TAG </H3>

<H4><U> E-commerce is dong business electronically </U><H4>

<H3> ITALICS TAG </H3>

<H4><i> E-commerce is dong business electronically </i></H4>

<H3> PREFORMATTED TAG </H3>

<H4> <PRE> E-commerce

is dong

business
electronically </PRE></H4>

<H3> STRONG TAG </H3>

<H4> <strong> E-commerce is dong business electronically </strong></H4>

<H3> EMPHASIS TAG </H3>

<H4> <em> E-commerce is dong business electronically </em></H4></P>

</BODY>

</HTML>

1. Then go to file menu> choose Save As.


2. Save the file with extension .html
3. Click Save.
4. Open the document and see the results

Result:-

As per the coding in notepad, the formatting of text appears the same. We have
used <b> tag for making the sentence bold, <u> tag for underlining the
sentence, <i> tag to make sentence in italics, <pre> tag to represents the text as
it was written in coding, <strong> tag to define important text and <em> tag to
emphasis the sentence.
Q2. Print paragraph that gives a description of E-commerce book which
include title of the book as well as Author information.

Tags used under this are:-

<P> tag:- used to identify blocks of paragraph text.

<CENTER> tag:- Anything inside this tag would be aligned with the middle of
the page.

<H2> tag:- Represents a level 2 heading in the HTML document.

Coding :-

<HTML>

<HEAD>

<TITLE> BOOK AND AUTHOUR DESCRIPTION </TITLE>

<BODY>

<H2><CENTER> BOOK= E-COMMERCE </CENTER></H2>

<P> E-COMMRCE is a general concept covering any form of business


transactions or information exchange executed using information and
communication technologies (ITC'S). E-commerce takes place between
companies, between companies and their customers and public administrations.
Electronic Commerce includes electronic trading of goods, services and
electronic material. E-commerce is doing business electronically. It means
selling data directly from the website or offering the website for download after
they are purchased online. Online stores like Amazon, Flipkart, Mynta, Ebay etc
are examples of E-commerce websites. Even the transaction of money, funds &
data are also considered as E-commerce. In addition, most of the e-commerce
sites these days provide 'cash on delivery' system where one can pay the amount
after receiving the product in condition and as desired. Today, e-commerce has
made a world into a market. One can order anything from any corner of the
world just by a click.</p>

<H2><CENTER> AUTHOR= DAVID WHITELEY </CENTER></H2>

<P> David Whiteley formerly Senior Lecturer at Manchester Metropolitan


University, has taught Information Systems, Systems Analysis and Design and
e-Commerce for last 20 years. Prior to moving to academia David spent over 20
years in the computing industry as a programmer, system analyst and project
manager.</p>

</BODY>

</HTML>

1. Then go to file menu> choose Save As.


2. Save the file with extension .html
3. Click Save.
4. Open the document and see the results:-

Result:-

Here, under this we have used certain tags like <H2> tag for making the
heading of the book, along with that we have used <CENTER> tag to put the
heading in the centre.

Moreover, we have used <p> tag used as a paragraph.

Likewise, we have used <H2> tag for making the heading of the Author name,
along with that we have used <CENTER> tag to put the heading in the centre.
Q5. Make a resume in HTML with objectives, professional education,
hobbies, extra curriculum activities and achievements etc.

Tags used under this are:-

<CENTER> tag:- Anything inside this tag would be in the middle of the page.

<H2> tag:- Represents a level 2 heading in the HTML document.

<UL> tag:- It is typically the bulleted list of items. . The list items in an
unordered list are marked with disc, square and circle.

<TR> tag:- It defines a row in an HTML table.

<TH> tag:- The cells inside it are defined using the <th> (a header cell)

<TD> tag:- The cells inside it are defined using the <td> (a standard cell).

Coding :-

<HTML>

<HEAD>

<TITLE> Make a Resume </TITLE>

</HEAD>

<BODY BGCOLOR= "GREY">

<H2><CENTER> RESUME </CENTER></H2>

<P><B> NAME </B> :- DIVYA BATRA </br>

<B> ADDRESS </B> :- RZ-110, G-BLOCK,</br>Prem Nagar, Najafgarh


</br> New Delhi-110043 </br>

<B> CONTACT No. </B>:- 9876553216 </br>

<B> E-mail ID </B>:- divyabatra44@yahoo.in </br> </P>

<hr color="black">

<P><B> OBJECTIVES </B>:- </br>

<ul type="circle">
<li>To achieve a responsible place in a organization with my best abilities of
hard dedication and knowledge.</li>

</ul></P>

<P><B> PROFESSIONAL QUALIFICATION </B>:- </br>

<ul type="circle">

<li>2017-18 Diploma in Global Aviation and Hospitality management</li>

<li>2018-19 Certificate in Galileo, Red cross training.</li>

</ul></P>

<P><B> EDUCATION QUALIFICATION </B> :- </br>

<TABLE BORDER="2">

<TR>

<TH> EDUCATION </TH>

<TH> BOARD/UNIVERSITY </TH>

<TH> YEAR OF PASSING </TH>

<TH> PERCENTAGE(%) </TH>

</TR>

<TR>

<TD> B.COM(H) </TD>

<TD> GGSIPU </TD>

<TD> 2020 </TD>

<TD> 85.12% </TD>

</TR>

<TR>

<TD> 12 <SUP>TH </SUP> </TD>

<TD> CBSE </TD>


<TD> 2017 </TD>

<TD> 85.75% </TD>

</TR>

<TR>

<TD> 10 <SUP>TH</SUP></TD>

<TD> CBSE </TD>

<TD> 2015 </TD>

<TD> 80% </TD>

</TR>

</TABLE>

<P><B> ACHIEVEMNETS</B>:-</br>

<ul type="circle">

<li>Certificate of National Conference in college.</li>

<li>Certificate for completion of Digital marketing course at Intern


Theory.</li>

<li>Certificate for completion of Advance Excel course at Intern Theory.</li>

</ul></P>

<P><B> HOBBIES</B>:-</br>

<ul type="circle">

<li>Singing</li>

<li>Dancing</li>

<li>Cooking</li>

</ul></p>

</BODY>

</HTML>
1. Then go to file menu> choose Save As.
2. Save the file with extension .html
3. Click Save.
4. Open the document and see the results:-

Result:-

Here you can see the unordered list to make a list of items. We have used <tr>
tag to make table row and for proper heading we have used <th> tag and to
define the cell in a standard form we have used <td> tag.
Q6. How to insert an image in a webpage?

In HTML, images are defined with the <img> tag. The <img > tag is empty; it
contains attributes only, and does not have a closing tag. The src attribute
specifies the URL (web address of the image).

We can different attributes in the image tag like:- height, width and border of
the image.

Example:- <img src= “C:\Users\divya\Desktop\IMG_2530.JPG ", width="400",

"height="400", border="10"/>.
PART1
PART 2
Here, in part 1 it defines the location and path of the image, in part 2 these are
the attributes of the image.

SYNTAX:- <img src= “url”>

Coding :-

<HTML>

<HEAD>

<TITLE>INSERT AN IMAGE IN A WEBPAGE </TITLE>

</HEAD>

<BODY>

<h3> Insert an image </h3>

<img src="C:\Users\divya\Desktop\IMG_2530.JPG ", width="400",


"height="400", border="10"/>

</BODY>

</HTML>

1. Then go to file menu> choose Save As.


2. Save the file with extension .html
3. Click Save.
4. Open the document and see the results.
Result:-

Here the image is displayed in the webpage including all the attributes like
border, width and height. We have put a simpe image on a webpage, we have
used the <img> element. This is an empty element (meaning that it has no text
content or closing tag) here it requires a minimum of one attribute to be useful-
src (source or location or path of an image).
Q7. Design a webpage for a company details in which you can make use
of:- Marquee, Italics, center, paragraph and font tags and its attributes.

Tags mainly used under this are:-

<Marquee> tag:- It is the scrolling piece of the text displayed either


horizontally or vertically depends on the web page set. It is the non- standard
HTML tag which is used to scroll an image or any text horizontally and
vertically.

<i> tag:- <i> tag is used to italicise the text. It opens with <i> and ends with
</i> tag.

<CENTER> tag:- Anything inside this tag would be aligned with the middle of
the page.

<P> tag:- used to identify blocks of paragraph text.

<font> tag:- It is used to change the color, size and style of a text.

Coding :-

<HTML>

<HEAD>

<TITLE> COMPANY DETAILS USING DIFFERENT TAGS </TITLE>

</HEAD>

<BODY>

<H1><MARQUEE> PATYM </MARQUEE></H1>

<P>Paytm is India's largest leading gateway that offers comprehensive payment


services for customers and merchants Paytm is a company operating a mobile
payment and commerce platform. It offers payments, banking, lending and
insurance services to consumers and merchants. The company offers online use-
cases like mobile recharges, utility bill payments, movies as well as in-store
payments at grocery, parking tolls etc with Paytm QR Code. It is a transparent
and ethical company and expects that its ethics and values are intentionally
upheld all across. Paytm is available in 11 languages and offers online use-
cases. It was founded in August 2010 with an initial investment of $2 million in
Noida a region adjacent to India's capital New Delhi. By January 2014, the
company launched the Paytm Wallet and the Indian Railways and Uber added it
as a payment option. Our investors include Softbank, SAIF partners, Alibaba
Group. We strive to maintain an open culture where everyone is a hands-on
contributor and feels comfortable sharing ideas and opinions.

</p></br>

<center><B><H3><U> Company details </U></H3></B></center>

<center><B> Type:-</B> Subsidiary </center>

<center><B> Headquarters:-</B> Noida </center>

<center><B> Founded:-</B> 2010 </center>

<center><B> Industry:-</B> E-commerce and finance </center>

<center><B> Founders:-</B> Viay Shekhar Sharma</center>

<center><B> Website:-</B> <i><font color="blue"> patym.com


</font></i></center></br>

<P><font face="calibri", size="4", color="blue"> ELIGIBILITY:- </font> The


Paytm services are not available to persons under the age of 18 or to anyone
previously suspended or removed by Paytm from availing the Services on the
Paytm Platform.

<font face="calibri", size="4", color="blue"> COMMUNICATION POLICY:-


</font> Paytm may send alerts to the mobile phone number provided by you
while registering with the Paytm platform for the service or any updated mobile
number subsequently provided by you on the platform, or via e-mail or push
notifications.</br>

<font face="calibri", size="4", color="blue"> LIMITATION OF LIABILITY


AND DAMAGES:- </font> In no event, Paytm or its contractors, agents,
licensors, partners or suppliers will be liable to you for any special, indirect,
incidental and exemplary damages.</p>

</BODY>

</HTML>
1. Then go to file menu> choose Save As.
2. Save the file with extension .html
3. Click Save.
4. Open the document and see the results.

Result:-

Here, < marquee> tag is used in the name of the company:- Paytm as it scrolls
from horizontally, <i> tag is used to give the website of Paytm, <font> tag is
used with attributes color =blue, size=4 and face=calibri to define the words like
eligibility, communication policy and limitation of liability and damages.
Q8. Design a web document in HTML to implement the ordered and
unordered list.

ORDERED LIST:- ordered list <ol> or Numbered list displays elements in


numbered format. We can use ordered list to represent items either in numerical
order format or alphabetical order format. There can be different types of
ordered list:

 Numeric Number (1,2,3)


 Capital Roman Number (I,II,III)
 Small Roman Number (i,ii,iii)
 Capital Alphabet (A B C)
 Small Alphabet(a b c)

Coding :-

<HTML>

<HEAD>

<TITLE> LISTS </TITLE>

</HEAD>

<BODY>

<H1> ORDERED LIST </H1>

<H3> BEVERAGES LIST </H3>

<OL TYPE="a">

<li> COFFEE </li>

<li> TEA </li>

<li> COLD DRINK </li>

<li> SUGARCANE JUICE </li>

</OL>

<OL TYPE="1">

<li> COFFEE </li>


<li> TEA </li>

<li> COLD DRINK </li>

<li> SUGARCANE JUICE </li>

</OL>

<OL TYPE="i">

<li> COFFEE </li>

<li> TEA </li>

<li> COLD DRINK </li>

<li> SUGARCANE </li>

</OL>

<BODY>

</HTML>

1. Then go to file menu> choose Save As.


2. Save the file with extension .html
3. Click Save.
4. Open the document and see the results.

Result:-

In the 1 st list we have used <ol type= “a”>, 2nd list e have used <ol type= “1”>
and in the last list we have used <ol type= “i”>
UNORDERED LIST:- unordered list <ul> or bulleted list displays elements in
bulleted format. We can use this list where e do not need to display items in any
particular order. There are 4 types of unordered list:-

 Disc
 Circle
 Square
 None

Coding :-

<HTML>

<HEAD>

<TITLE> LISTS </TITLE>

</HEAD>

<BODY>

<H1> UNORDERED LIST </H1>

<H3> SWEETS </H3>

<UL TYPE="circle">

<li> JALEBI </li>

<li> GULAB JAMUN </li>

<li> MILK CAKE </li>

<li> BURFI </li>

<li> RASGULLA </li>

</UL>

<UL TYPE="disc">

<li> JALEBI </li>

<li> GULAB JAMUN </li>

<li> MILK CAKE </li>


<li> BURFI </li>

<li> RASGULLA </li>

</UL>

<UL TYPE="square">

<li> JALEBI </li>

<li> GULAB JAMUN </li>

<li> MILK CAKE </li>

<li> BURFI </li>

<li> RASGULA </li>

</UL>

</BODY>

</HTML>

1. Then go to file menu> choose Save As.


2. Save the file with extension .html
3. Click Save.
4. Open the document and see the results.

Result:-

In the first list of sweets we have used <ul type= “circle”>, then <ul type=
“disc”> and in last <ul type= “square”>
Q9. Design a webpage using Nested list in Ordered List.

A nested list or a sub list is a list within a list. The trick to marking nested lists
up correctly in HTML is to recognize that the sub list is actually a child of a list
item and not of a list.

Coding :-

<HTML>

<HEAD>

<TITLE> NESTED LIST </TITLE>

</HEAD>

<BODY>

<H2> GROCERY LIST </H2>

<OL>

<LI> Fruits

<OL TYPE="A">

<li> Bananas </li>

<li> Apples </li>

<li> Pears </li>

<li> Watermelon </li>

</OL>

</LI>

<LI> Vegetables

<OL TYPE="1">

<li> Tomato </li>

<li> Cabbage </li>

<li> Onion </li>


<li> Raddish </li>

<li> Carrot </li>

</OL>

</LI>

<li> Meat</li>

<li> Oil </li>

<li> Almonds </li>

<li> Frozen foods </li>

</OL>

</BODY>

</HTML>

1. Then go to file menu> choose Save As.


2. Save the file with extension .html
3. Click Save.
4. Open the document and see the results.

Result:-

Here you can notice that the nested list is created under fruits and vegetables
which is in the form of a sublist of these mentioned above.
Q10. Design a web document in HTML to implement the Menu and
Directory list.

MENU LIST:- It also looks like unordered list but it should be rendered more
compact, not all browsers make this distinction and some render it without a
bullet. It is a container tag <menu>.......</menu>.

DIRECTORY LIST:- It is similar to the unordered list which represents list of


short items typically upto 20 characters. Items may be arranged in columns. It
doesn’t work in XML. It is a container tag <dir>......</dir>

Coding for menu & directory list :-

<HTML>

<HEAD>

<TITLE> MENU & DIRECTORY LIST </TITLE>

</HEAD>

<BODY>

<H2> MENU LIST</H2>

<menu>

<li> ol- ordered list </li>

<li> ul- unordered list </li>

<li> dl- definition list </li>

<li> dir- directory list </li>

<li> menu- menu list </li>

</menu></br>

<H2> DIRECTORY LIST </H2>

<dir>

<li> red </li>

<li> orange </li>


<li> yellow </li>

<li> green </li>

<li> blue </li>

<li> indigo </li>

<li> violet </li>

</dir>

</BODY>

</HTML>

1. Then go to file menu> choose Save As.


2. Save the file with extension .html
3. Click Save.
4. Open the document and see the results.

Result:-
Q11. Design a web document in HTML to create a table which contains the
record of 10 students.

Tags used under this are:-

<TR> tag:- It defines a row in an HTML table.

<TH> tag:- The cells inside it are defined using the <th> (a header cell)

<TD> tag:- The cells inside it are defined using the <td> (a standard cell).

Coding :-

<HTML>

<HEAD>

<TITLE> TABLE OF STUDENTS </TITLE>

</HEAD>

<BODY>

<H2> RECORD OF STUDENTS</H2>

<TABLE BORDER="2">

<TR>

<TH> ROLL NO. </TH>

<TH> NAME </TH>

<TH> COURSE </TH>

<TH> PARENT NAME </TH>

<TH> PHONE NO. </TH>

<TH> E-MAIL ID </TH>

</TR>

<TR>

<TD> 1 </TD>

<TD> DEEPAK </TD>


<TD> B.COM(H) </TD>

<TD> SAVITA </TD>

<TD> 9854675543 </TD>

<TD> deepak99@gmail.com </TD>

</TR>

<TR>

<TD> 2 </TD>

<TD> DIVYA BATRA </TD>

<TD> B.COM(H) </TD>

<TD> YOGESH BATRA </TD>

<TD> 955123455 </TD>

<TD> divya1999@gmail.com </TD>

</TR>

<TR>

<TD> 3 </TD>

<TD> UJJWAL SINGH </TD>

<TD> B.COM(H) </TD>

<TD> ANJU SINGH </TD>

<TD> 8843510012</TD>

<TD> ujjwalsingh99@gmail.com </TD>

</TR>

<TR>

<TD> 4 </TD>

<TD> PARIKSHIT KUCHHAL </TD>


<TD> B.COM(H) </TD>

<TD> PARVEEN KUCHHAL </TD>

<TD> 7611653472 </TD>

<TD> parikshit98@gmail.com </TD>

</TR>

<TR>

<TD> 5 </TD>

<TD> HIMANSHI </TD>

<TD> B.COM(H) </TD>

<TD> ASHU KATHURIA </TD>

<TD> 9899654312 </TD>

<TD> himanshi101@gmail.com </TD>

</TR>

<TR>

<TD> 6</TD>

<TD> PRIYA JAIN </TD>

<TD> BBA(G) </TD>

<TD> SARITA JAIN </TD>

<TD> 9999125643 </TD>

<TD> priyajain9988@gmail.com </TD>

</TR>

<TR>

<TD> 7 </TD>

<TD> AJAY VERMA </TD>


<TD> BCA </TD>

<TD> VIMAL VERMA </TD>

<TD> 8788123421 </TD>

<TD> ajay88@gmail.com </TD>

</TR>

<TR>

<TD> 8 </TD>

<TD> RIYA BAJAJ </TD>

<TD> BBA(CAM) </TD>

<TD> ANITA BAJAJ </TD>

<TD> 9912004567 </TD>

<TD> riyabajaj45@gamil.com </TD>

</TR>

<TR>

<TD> 9</TD>

<TD> VIJAY SINGH </TD>

<TD> BCA </TD>

<TD> GAGAN SINGH </TD>

<TD> 8877120987 </TD>

<TD> vijay88@gmail.com </TD>

</TR>

<TR>

<TD> 10 </TD>

<TD> SONIA </TD>


<TD> BBA(G) </TD>

<TD> RAGHAV MISHRA </TD>

<TD> 9912004567 </TD>

<TD> sonia001@gmail.com</TD>

</TR>

</TABLE>

</BODY>

</HTML>

1. Then go to file menu> choose Save As.


2. Save the file with extension .html
3. Click Save.
4. Open the document and see the results.

Result:-

Вам также может понравиться