Basic HTML
Basic HTML
Question 17 Give the coding for giving the heading 'PACE Computer Education' of <H1> tag, font style as Comic Sans MS, text color as blue.
Body text color as red, background as green, alignment as center, font style of body text as Brush script, size = 15. The text for body is as follows
Education is the
ability to listen to almost
anything without
losing your temper
or your
self confidence.
And so is Democracy and Maturity too.
Answer
<HEAD>
<TITLE> Welcome to My Web Page </TITLE>
<BODY>
my web page
</BODY>
</HEAD>
Type attribute is not used with <FONT> tag. To make the text bold, we use the <B> or <STRONG> tag.
The correct code is as follows:
<FONT face = "Arial" size = "3">
Question 18(iii)
Question 18(iv)
All HTML tags are enclosed in angle brackets (< >). The values of attributes are given in double quotes (" ").
Question 18(v)
Question 18(vi)
<BR> </BR>
Answer
Question 18(vii)
The paragraph <P> tag and the font <FONT> tag should be written in separate angle brackets as both are different tags.
The correct code is as follows:
Question 18(viii)
The attributes 'leftmargin' and 'topmargin' of <BODY> tag are used to specify the left and top margin of the document, respectively. The values
of attributes should be enclosed in double quotes (" ").
The correct code is as follows:
Question 18(ix)
<BODY>
<BASEFONT SIZE = 5>
Text with New format
</BODY>
Question 18(x)
<HTML>
<HEAD>
<TITLE> New Page
</HEAD>
</TITLE>
</HTML>
Answer
The <TITLE> tag must be entered between the opening and closing <HEAD> tags.
The correct code is as follows:
<HTML>
<HEAD>
<TITLE> New Page
</TITLE>
</HEAD>
</HTML>
Question 19
Question 20
Answer
Container elements require both, an opening and a Empty elements require only an
Container elements Empty elements
Container elements affect the text appearing between Empty elements just carry out
their opening and a closing tag. the job assigned to them.
For example, <TITLE>...</TITLE>, <FONT>...</FONT> etc. For example, <BR>, <HR> etc.
Question 21
Question 22
Answer
HTML has six levels of headings, numbered 1 through 6, with 1 being the largest. Headings are typically displayed in larger and bolder fonts
than normal body text.
1. <H1>
2. <H2>
3. <H3>
4. <H4>
5. <H5>
6. <H6>
The first heading in a document is tagged <H1>, the second heading is tagged as <H2> and so on.
Question 23
Answer
The attributes are used with <BODY> tag in the following way:
<BODY ALINK = "BLUE" VLINK = "YELLOW" BACKGROUND = "ANIMALS.JPG" BGCOLOR = "BLACK" TEXT = "WHITE" LEFTMARGIN = "60"
TOPMARGIN = "80">
Question 24
Answer
Question 25
Answer
The <HR> tag is used to produce horizontal line spread across the width of the browser window. By default, a 3D horizontal line is produced.
If we want to produce a 2D rule, we add "noshade" to <HR> tag.
For example:
Question 26
Answer
Logical text styles are general descriptions. Each browser handles a logical style in its own way. Logical styles render the text according to its
meaning. For example, <EM> is for emphasizing something and <STRONG> is for strongly emphasizing something.
<STRONG> This is an example of logical text style </STRONG>
Physical text styles indicate the specific type of appearance for a section. For example, bold, italics, underlined etc. They are rendered in the
same manner by all browsers.
Question 27
Answer
HTML allows us to combine various tags together so as to achieve the desired result and effect. Different tags are enclosed in one another to
combine their effects.
For example, if we want our text to appear bold and underlined, we can use <B> and <U> tags together in the following manner:
<B><U> Bold and Underlined </U></B>
Question 28
Answer
1. <HTML>...</HTML>
2. <HEAD>...</HEAD>
3. <BODY>...</BODY>
Question 29
Write the HTML code for the following to appear one after the other :
Answer
Output
Question 30
Insert the appropriate line break and paragraph break tags to format the following poems with a blank line between them :
<P>
A Morning is a Wonderful Blessing, <BR>
Either Cloudy or Sunny <BR>
It stands for Hope, giving us another <BR>
Start of what we call Life. <BR>
</P>
Output
Question 31
Write a complete HTML Web page with the title "Foo Bar" and a heading at the top which reads "Happy Hour at the Foo Bar", followed by the
words "Come on down!" in regular type.
Answer
<HTML>
<HEAD>
<TITLE> Foo Bar </TITLE>
</HEAD>
<BODY>
<H1> Happy Hour at the Foo Bar </H1>
<P>Come on down!</P>
</BODY>
</HTML>
Output
Question 32
Answer
Output
Question 33
Answer
1. Unnumbered or bulleted list — These lists are indented lists with a special bullet symbol in front of each item. For example,
<UL>
<LI>Apples</LI>
<LI>Bananas</LI>
<LI>Grapes</LI>
</UL>
2. Numbered or ordered list — These are indented lists that have numbers or letters in front of each item. For example,
<OL>
<LI>Apples</LI>
<LI>Bananas</LI>
<LI>Grapes</LI>
</OL>
3. Definition lists — A definition list <DL> usually consists of an alternating definition term <DT> and a definition description <DD>. For example,
<DL>
<DT>Apples</DT>
<DD>Apples are rich in Vitamin A. They are good for eye sight. They should be eaten in the morning.</DD>
<DT>Bananas</DT>
<DD>Bananas are rich in calcium. They keep the stomach healthy. They should be eaten during the day.</DD>
</DL>
Question 34
Answer
Ordered list are indented lists that have Unordered list are indented lists with a
numbers or letters in front of each item. special bullet symbol in front of each item.
Answer
We can nest an unordered list inside an ordered list in the following manner:
<OL>
<LI>Fruits
<UL>
<LI>Apples</LI>
<LI>Grapes</LI>
<LI>Bananas</LI>
</UL>
</LI>
<LI>Vegetables
<UL>
<LI>Potatoes</LI>
<LI>Cabbages</LI>
<LI>Gourd</LI>
</UL>
</LI>
<LI> Dairy Products
<UL>
<LI>Milk</LI>
<LI>Curd</LI>
<LI>Buttermilk</LI>
</UL>
</LI>
</OL>
Question 36
Answer
The three tags that let us create the definition lists are :
<DL>
<DT>Apples</DT>
<DD>Apples are rich in Vitamin A. They are good for eye sight. They should be eaten in the morning.</DD>
<DT>Bananas</DT>
<DD>Bananas are rich in calcium. They keep the stomach healthy. They should be eaten during the day.</DD>
</DL>
Question 37
Answer
(i) The <UL> and <LI> tags let us create unnumbered lists.
(ii) The <OL> and <LI> tags let us create numbered lists.
Application Oriented Questions
Question 1
Hamish is creating a website for the Highland Chess League. Part of the HTML for the home page is shown below:
<head>
<title> Highland Chess League </title>
<meta name = "description" content = "The Highland Chess League" />
<meta name = "keywords" content = "chess, league, games, Highland, hobbies" />
</head>
<body>
<div align = "centre">
<p> Welcome to the Highland Chess League Home Page </p>
<p>Play the board <u>not</u> the man </p>
</div>
</body>
(a) The window shown alongside is seen when a browser is used to view the home page. Use the HTML code above to identify the contents
displayed in A, B and C.
(b) The meta tag specifies keywords used by spiders of search engines. Where do you provide (inside which tag) the meta information in HTML
code ?
Answer
Explanation
Question 2
1. a web address
2. a postal address
3. an email address
4. an office address
1. P
2. R
3. S
4. T
1. Left
2. right
3. center
4. same as alignment of pointer S
(d) The text at S provides a way to contact Ski Breaks Ltd using :
1. fax
2. post
3. email
4. telephone
(e) To use the Internet to find more websites about winter sports, the user should use :
1. a book
2. an email
3. a CD ROM
4. a search engine
Answer
Reason — A web address or URL is given in the address bar of the browser to access a web page.
(b) R
Reason — R is a link which can be followed by clicking to find more information about the destination (USA).
(c) Left
(d) email
Reason — A search engine helps a user to find information about any topic using keywords.
Practical Assessment
Question 1
<HTML>
<BODY>
<P>
This paragraph contains a lot of lines in the source code, but the browser ignores it.
</P>
<P>
This paragraph contains a lot of spaces in the source code, but the browser ignores it.
</P>
<P>
The number of lines in a paragraph depends on the size of your browser window.
If you resize the browser window, the number of lines in this paragraph will change.
</P>
</BODY>
</HTML>
Answer
Output
Question 2
Answer
Output
Question 3
<HTML>
<BODY>
<P>
My Bonnie lies over the ocean.
My Bonnie lies over the sea.
My Bonnie lies over the ocean.
Oh, bring back my Bonnie to me.
</P>
<P> Note that your browser simply ignores your formatting!</P>
</BODY>
</HTML>
Answer
Output
Question 4
<HTML>
<BODY>
<H1>This is heading 1</H1>
<H2>This is heading 2</H2>
<H3>This is heading 3</H3>
<H4>This is heading 4</H4>
<H5>This is heading 5</H5>
<H6>This is heading 6</H6>
<P>Use heading tags only for headings. Don't use them to make something big.
Use other tags for that.</P>
</BODY>
</HTML>
Answer
Output
Question 5
Centralized heading.
<HTML>
<BODY>
<H1 align = "center">This is heading 1</H1>
<P>The heading above is aligned to the center of this page. The heading above is aligned to the center of this page. The heading above is
aligned to the center of this page.</P>
</BODY>
</HTML>
Answer
Output
Question 6
<HTML>
<BODY>
<P>The hr tag defines a horizontal rule:</P>
<HR>
<P>This is a paragraph</P>
<HR>
<P>This is a paragraph</P>
<HR>
<P>This is a paragraph</P>
</BODY>
</HTML>
Answer
Output
Question 7
<HTML>
<BODY>
<!--This comment will not be displayed-->
<P>This is a regular paragraph</P>
</BODY>
</HTML>
Answer
Output
Question 8
<HTML>
<BODY bgcolor = "yellow">
<H3>Look: Colored Background!</H3>
</BODY>
</HTML>
Answer
Output
Question 9
<HTML>
<BODY background = "background.jpg">
<H3>Look: Image Background!</H3>
<P>Both gif and jpg files can be used as HTML backgrounds.</P>
<P>If the image is smaller than the page, the image will repeat itself.</P>
</BODY>
</HTML>
Answer
Output
Question 10
Text formatting.
<HTML>
<BODY>
<B>This text is bold</B>
<BR>
<STRONG>This text is strong</STRONG>
<BR>
<BIG>This text is big</BIG>
<BR>
<EM>This text is emphasized</EM>
<BR>
<I>This text is italic</I>
<BR>
<SMALL>This text is small</SMALL>
<BR>
This text contains<SUB> subscript</SUB>
<BR>
This text contains
<SUP>
superscript
</SUP>
</BODY>
</HTML>
Start Notepad from Programs menu. In the opened file give the coding for the following :
(i) Give the Title Pace Computer Education. (this should appear on title bar)
(ii) Make the background colour as Grey and text colour as Red.
(iii) Give the heading My First Web Page as H1 tag, Face = Times New Roman, Color = Red, Align = Center.
(iv) Write the paragraph with <P> tag, Align = Right, Font = Comic Sans MS, Color = Blue and Size = 4.
Today, one of the major reasons businesses, homes and other users purchase computers is to gain Internet access. Many companies and
organizations assume that the public is familiar with the Internet. Web addresses appear on television, in radio broadcasts, in printed news-
papers, magazines and in other forms of advertising. Software companies use their Web sites as a place for you to download upgrades or
enhancements to software products. To be successful today, you must have an understanding of the Internet. Without it, you are missing a
tremendous resource for goods, services and information.
(v) Create two copies of above paragraph and apply <B> tag, <TT> tag, <I> and <U> tags in between.
(vi) "Exciting Features Offered By HTML". Give it as heading H3, Align = Left, Color = Red, Font = Comic Sans Ms.
1. E-Mail
2. Information
3. Discussion Groups
4. Online- Shopping
5. Entertainment
6. Programme
(viii) Add a horizontal rule spread on the 50% of the browser window.
(ix) Combine different font effects : <B>, <I>, <U> and <TT>.
(x) Select File menu and click on Save, type your file name with extension .HTML, and click on Save button to complete the procedure of saving.
Answer
<HTML>
<HEAD>
<TITLE> Pace Computer Education </TITLE>
</HEAD>
<P> Today, one of the <B> major reasons </B> businesses, homes and other users purchase computers is to gain Internet access. Many
companies and organizations assume that the public is <TT> familiar with the Internet </TT>. Web addresses appear on <I> television, in radio
broadcasts, in printed news-papers, magazines and in other forms of advertising </I>. Software companies use their Web sites as a place for
you to download upgrades or enhancements to software products. To be successful today, you must have an understanding of the Internet.
Without it, you are <U> missing a tremendous resource </U> for goods, services and information. </P>
Today, one of the <TT> major reasons </TT> businesses, homes and other users purchase computers is to gain Internet access. Many
companies and organizations assume that the public is <B> familiar </B> with the Internet. Web addresses appear on television, in radio
broadcasts, in printed news-papers, magazines and in other forms of advertising. Software companies use their Web sites as a place for you to
<I> download upgrades or enhancements </I> to software products. To be successful today, you must have an understanding of the Internet.
Without it, you are <U> missing </U> a tremendous resource for goods, services and information.
</BODY>
</HTML>
Output
Question 21
<HTML>
<BODY>
<H4>Numbered list:</H4>
<OL>
<LI>Apples</LI>
<LI>Bananas</LI>
</OL>
<H4>Letters list:</H4>
<OL type="A">
<LI>Apples</LI>
<LI>Bananas</LI>
<LI>Lemons</LI>
<LI>Oranges</LI>
</OL>
<H4>Lowercase letters list:</H4>
<OL type="a">
<LI>Apples</LI>
<LI>Bananas</LI>
</OL>
<H4>Roman numbers list:</H4>
<OL type="I">
<LI>Apples</LI>
<LI>Bananas</LI>
</OL>
<H4>Lowercase Roman numbers list:</H4>
<OL type="i">
<LI>Apples</LI>
<LI>Bananas</LI>
</OL>
</BODY>
</HTML>
Answer
Output
Question 22
<HTML>
<BODY>
<H4>Disc bullets list:</H4>
<UL type="disc">
<LI>Apples</LI>
<LI>Bananas</LI>
</UL>
<H4>Circle bullets list:</H4>
<UL type="circle">
<LI>Apples</LI>
<LI>Bananas</LI>
</UL>
<H4>Square bullets list:</H4>
<UL type="square">
<LI>Apples</LI>
</UL>
</BODY>
</HTML>
Answer
Output
Question 23
Nested List.
<HTML>
<BODY>
<H4>A nested List:</H4>
<ul>
<LI>Coffee</LI>
<LI>Tea</LI>
<ul>
<LI>Black tea</LI>
<LI>Green tea</LI>
</UL>
<LI>Juice</LI>
<LI>Milk</LI>
</UL>
</BODY>
</HTML>
Answer
Output
Question 24
Definition List.
<HTML>
<BODY>
<H4>A Definition List:</H4>
<DL>
<DT>Coffee</DT>
<DD>Black hot drink</DD>
<DT>Milk</DT>
<DD>White cold drink</DD>
</DL>
</BODY>
</HTML>
Answer
Output
Question 25
Answer
Output
Question 26
II. Recourse for a lady toward unpleasant men who persist in bowing.
III. A simple stare of iciness should suffice in most instances.
IV. Her ignorance is sufficient that she is not willing to be friendly.
V. As a last resort: " Sir, I have not the honor of your acquaintance."
Answer
Output
Question 27
Output
Question 28
Insert the <UL> tags (unordered list) around the following list text.
Car
Scooter
Van
Answer
Output
Question 29
Insert the <OL> tag (ordered list) around the following list text.
e. Story Books
f. Computer Books
g. Text Books
h. General Books
Change the style of the bullets : e.g., I, i, A and 1,2
Answer
Output
Question 30
Create a nest list as follows using both ordered and unordered list tags :
1. Operating System
MS - Office
Word
Excel
PowerPoint
Access
OpenOffice.org
Writer
Calc
Impress
Base
Accessories
Paint
Calculator
Note Pad
Word Pad
Answer
Output
Question 31
Answer
<LI>
MS - Office
<UL TYPE = "SQUARE">
<FONT FACE = "ARIAL BLACK" COLOR = "BLUE" SIZE = "3">
<LI> Word </LI>
<LI> Excel </LI>
<LI> PowerPoint </LI>
<LI> Access </LI>
</FONT>
</UL>
</LI>
<LI>
OpenOffice.org
<UL TYPE = "DISC">
<FONT FACE = "TIMES NEW ROMAN" COLOR = "GREY" SIZE = "3">
<LI> Writer </LI>
<LI>Calc </LI>
<LI>Impress </LI>
<LI>Base </LI>
</FONT>
</UL>
</LI>
<LI>
Accessories
<UL TYPE = "DISC">
<FONT FACE = "ARIAL" COLOR = "MAGENTA" SIZE = "3">
<LI> Paint </LI>
<LI> Calculator </LI>
<LI> Note Pad </LI>
<LI> Word Pad </LI>
</FONT>
</UL>
</LI>
</FONT>
</OL>
Output
Question 32
Write HTML code to display an ordered list (with uppercase roman numbers) listing any three subjects being taught in your school. The web
page should have a red background and the title of the page should be 'My Subjects'.
Answer
<HTML>
<HEAD>
<TITLE>My Subjects</TITLE>
</HEAD>
<BODY BGCOLOR = "RED">
<OL TYPE = "I">
<LI>English</LI>
<LI>Mathematics</LI>
<LI>Computer Applications</LI>
</OL>
</BODY>
</HTML>
Output
Question 1
(ii) The tag ............... is used to create subscripts and ............... tag is used to create superscripts on a web page.
Answer
(ii) The tag <SUB> is used to create subscripts and <SUP> tag is used to create superscripts on a web page.
Question 2(i)
1. HTML
2. BODY
3. HEAD
4. All the above
Answer
<html>
<head>
<title> ... </title>
</head>
<body>
...the body of the document...
</body>
</html>
Question 2(ii)
1. Size
2. Colour
3. Width
4. Length
Answer
Length
Reason — The attributes of <HR> tag are size, color and width which are used for setting the thickness, the color and the percentage of the
window covered by the rule, respectively. Length is not used with <HR> tag.
Question 2(iii)
1. Surfer
2. Portal
3. Browser
4. Provider
Answer
Browser
Reason — A web browser is a program that lets us visit different websites on the internet and display their offerings on our own computer. For
example, Google Chrome, Mozilla Firefox, Safari, etc.
Question 2(iv)
1. <?-->
2. <?---?>
3. <!-- and -->
4. </--->
Answer
Question 2(v)
1. MS Power Point
2. Internet Explorer
3. MS Excel
4. Notepad
Answer
Notepad
Question 3
Answer
Question 4
Answer
To display text in the title bar of browser, we write the text within <TITLE> tag. Consider the following example,
<HEAD>
<TITLE> Text for the title bar </TITLE>
</HEAD>
Question 5
Answer
The font size of a single line on a web page can be changed by using <FONT> tag. Consider the following example,
<FONT> Line of Text </FONT>
Question 6
Distinguish between <P> tag and <BR> tag with the help of an example.
Answer
<BR> tag is a line break tag that is used to end one line and jump to the next line without showing any line in between. It is an empty element.
<P> tag is a paragraph tag that is used to define a paragraph of text. It is a container element.
The following example highlights the difference between the two:
Question 7
Why do we insert comments in an HTML document even though they are not displayed on a web page ?
Answer
1. Comments can be used to explain code. The explanation can be for oneself or for other people.
2. Comments can be used to leave notes, a reminder to come back to a section or prioritize it during the next redesign.
Question 8
Answer
The first page that appears when viewers A website is a complete collection of
go to a website is called the Homepage. interconnected web pages.
Question 9
Answer
We can insert horizontal lines in a Web Page by using the <HR> tag.
Question 10
Answer
Comments are inserted in HTML code by enclosing them in <!-- and --> tags. For example,
<BODY>
<!-- Body tag starts here -->
This is the document body.
</BODY>
Here, the text "Body tag starts here" is enclosed in <!-- and --> and thus, it is regarded as comment and not displayed in the web browser.
Question 11
What do you mean by the term 'source code' of the current page viewed in a Web Browser ?
Answer
The term 'source code' refers to the underlying HTML, CSS, and JavaScript code of the current web page viewed in a web browser.
Question 12
Which tag do we use to change the size and style (face) of the text of a HTML file viewed on a Web Browser ? Also explain any two attributes
used with this tag.
Answer
We use the <FONT> tag to change the size and style (face) of the text of a HTML file viewed on a Web Browser. Two attributes of
the <FONT> tag are:
Question 13
The purpose of using the tags <H1> ... <H6> is to define headings of different levels, with <H1> being the highest level and <H6> being the
lowest level.
Question 14
What is the method of viewing the source code of the current page in Web Browsers ?
Answer
A user can right click on the Web page and then select "View Source" from the context menu to view the source code of the current page in a
Web Browser.
Question 15
Answer
Comments are inserted in HTML code by enclosing them in <!-- and --> tags. For example,
<BODY>
<!-- Body tag starts here -->
This is the document body.
</BODY>
Here, the text "Body tag starts here" is enclosed in <!-- and --> and thus, it is regarded as comment and not displayed in the web browser.
Question 16
What is the use of <BODY> tag in HTML code ? Write any two attributes used with this tag.
Answer
The <BODY> tag defines a document's body. It contains all the contents of an HTML document, such as the text, images, lists, tables, hyperlinks
etc.
The two attributes used with this tag are:
Question 17
Answer
Container elements require both, an opening and a Empty elements require only an
closing tag. opening tag and not a closing
Container elements Empty elements
tag.
Container elements affect the text appearing between Empty elements just carry out
their opening and a closing tag. the job assigned to them.
For example, <TITLE>...</TITLE>, <FONT>...</FONT> etc. For example, <BR>, <HR> etc.
Question 18
What is the use of <font> tag in HTML code ? Write any two options used with this tag.
Answer
We use the <FONT> tag to change the size, colour and style (face) of the text of a HTML file viewed on a Web Browser. Two attributes of
the <FONT> tag are:
Question 19
Which HTML tag is used to insert an image in a page ? Write an option used with this tag.
Answer
Question 20
(i) <LI>
(ii) <VLINK>
(iii) <HR>
(iv) <P>
Answer
Question 21
(i) border
(ii) img
(iii) alt
(iv) src
(v) href
Answer
Question 22
Name the following with respect to HTML : Attribute for changing bullet type of list tag.
Answer