HTML Advancedtables, Lists & Links - Chapter 6 TOPIC - 1 Lists and Links Objective Type Questions
HTML Advancedtables, Lists & Links - Chapter 6 TOPIC - 1 Lists and Links Objective Type Questions
(a) <hyperlink>
(b) <link>
(c) <a>
(d) <style>
Ans. <a>
(a) src
(b) href
(c) rel
(d) link
(a) URS
(b) URK
(c) URL
(d) URM
(a) unvisited
(b) visited
(c) active
8. which of the attribute (s) cannot be present if the href attribute is not present?
(a) hreflang
(b) rel
(c) target
(d) all of these
(c) target
10. which of the following will produce a solid circle bullet when given as a type for <UL>?
(a) circle
(b) square
(c) disc
Ans. true
Ans. false
Ans. false
Ans. True
5. an email can be created by using sendto: Attribute.
Ans. false
Ans. true
Ans. UL
3. A/An ……. Link allows a link to another section on the same web page.
Ans. URL
Ans. blue
5. in case of ordered lists, the <LI> tag inserts a ………. And for unordered list, it inserts a ………..
Ans. <DT>
Ans. <DD>
Ans. there are 3 types of lists – ordered lists, unordered lists and definition lists
Ans. type attribute is used to change the shape of the bullets in the unordered list. There are three
types. DISC, SQUARE, CIRCLE
Ans. the START attribute is used to change the beginning value of an ordered list. Normally, the ordered
list starts with 1. For example, <OL START = “5”> </OL>
Q.4. identify the error in the following HTML code. Rewrite the correct code.
Ans. <OL> stands for ordered list. This tag is used to display an ordered/a numbered list.
<UL> stands for unordered list. This tag is used to display a bulleted list.
Q.6. write the name of HTML tag used to include numbered list in HTML web page.
Ans. the code will set the web page background as yellow, text color as red and visited link color as blue.
Q.8. your school’s web address is https://www.cbsepractice.in/ want to create a link to this web site
from your web page. Write the HTML code you will use to do this.
Ans. <a> as an anchor allows us to go from one part of the same page to another while <A> as a link
allows us to go from one page to another page.
Q.10. which attribute of the <A> tag is used to add a text pop-up to an element in your web page?
Ans. title attribute of the <A> tag is used to add a text pop-up to an element in web page.
Q.11. write the code to create an image named “heritage.gif” as a hyperlink to” india.html”.
<img src=”heritage.gif></A>
Ans. name attribute allows the user to create links within the same document. This attribute specifies
the name of the anchor being set up and always it should not be unique.
Ans. unordered list classifies the data items that have equal importance i.e. none of the data items are
ranked. They are identified by a symbol. It may be a square, a O circle or a disc. The attribute TYPE helps
in using the symbols of the symbol.
<ul type=”disc”>
<ul type=”circle”>
This is a container tag. It has both the opening and the closing tag. The listing is created under it using
the <li> tag. Again <li> tag is a container tag. The data item to be listed is input between the opening <li>
and the closing </li> tag as shown in the following example.
<body> Apples
<ul> Oranges
<li>apples >li> Guava
<li>oranges</li>
<li>guave<li>
</ul>
</body>
Q.2. write a short note on ordered list.
Ans. ordered list classifies the data items that do not have equal importance. All the data items are
ranked. The renking can be done using the numbers, the roman letter or alphabets. The default symbol
is number. In case you want to change to other symbols of ordered used with this tag are given in the
table below:
Ans. definition lists (<dl>)are the list elements that have an array of tags. The list prepared by <dl> tag is
similar to a dictionary. The other tags used with this are <dt> to define the definition term and the <dd>
for the definition of the list item.
Ans. we can create an email link on web page. The browser will read an email link, using the value
starting with mailto:” rather than http://, with an email address rather than a web address. The syntax is
given below:
Example:
<BR> ILLUSTRATION of nested lists
<H4> ILLUSTRATION of nested lists </h4> Subjects of study
<BODY> 1. math
<H4>SUBJECTS OF STUDY 2. English
</h4> 3. language
<ol> 0 Hindi
<li> Math O Sanskrit
<li> English 0 Tamil
<li> language 4. science
</ul> 5. social science
<li> science 6. computer applications
<li> social science
<li> computer
Applications
</ol>
</BODY>
Q.6. Shambhavi has to design two web pages with following specifications:
(i) one web page should have an unordered list. (ii) another web should have an unordered list. “yellow”
in color.
Suggest her suitable tag(s) and attributer(s) for the above specifications.
Q.7. Jennifer wants to write html code to crate an ordered list starting with “c”. help her in writing the
code.
Q.9. create an ordered list of the name of the subjects you study in school.
Ans. <ol>
<li> English </li>
</ol>
Ans. <html>
<head>
<title>
Link
</title>
</head>
<body>
</body>
</html>
Q.11. how will you nest an unordered list inside an ordered list?
Ans. <html>
<head>
</title>
<head>
<body>
<ol>
</ul>
</li>
</ol>
</body>
</html>
Q.12. write the HTML code to create the following indentation effect: apple pie, pudding, and pancake,
all begin with an A.
Ans. <html>
<head>
</head>
<body>
<dl>
<dl>
</dl>
</dl> </body>
</html>
Q.13. use a definition list to show that the word “glunch” means “a look of disdain, anger, or
displeasure” and that the word “glumpy” means “sullen, morose, or sulky”
Ans. <html>
<head>
</head>
<body>
<DL>
</DL>
</body>
</html>
Ans.
<html>
<head>
<title> INSERT SOUND FILE <title>
</head>
<body>
<audio controls=”controls”
</audio>
</body>
</html>
Ans.
<html>
<head>
<body>
<h2> lest watch a video </h2>
</body>
</html>
Q.18. Shahnawaz has to create following list through HTML as a part of his social science project. Help
him in writing HTML code for the same.
Ans.
<HTML>
<BODY> AFRICAN COUNTRIES AND THEIR
CAPITALS<BR>
<OL> <LI> EGYPT
<UL TYPE=”circle”>
<LI> Cairo</UL>
<LI> ETHIOPIA
<UL TYPE = “circle’>
<LI> Addis Ababa</UL>
>LI> KHNYA<UL>TYPE=”circle”>
<LI> Nairobi</UL>
</OL>
</BODY>
</HTML>
Ans. <html>
<head>
</head>
<li> MUMBAI</LI>
</ul>
</body>
</html>
Q.21. write HTML code to display an ordered list (with uppercase roman number) listing any three
subjects being taught in your school. The web page should have a red back grounds and the title of the
page should be “my subjects.”
Ans. <html>
<head>
</head>
<body bgcolor=”red”>
<computers</li>
</ol>
</body>
</html>
Long Answer Type Questions
Q.1. write a short note on anchor tag.
Ans. an anchor element is used to create a hyperlink in a webpage. The word anchor has came the
function performed by anchor in a ship. As an anchor supports the ship when it reaches the shore,
similarly, the document linked supports the text or the picture on the home page.
HREF: the meaning of href is hypertext reference. This attribute is mandatory in anchor. The href
attribute takes the value as the address of the supporting document. Both the relative and absolute links
can act as values to the href attribute.
To link to a page on another website you need to give the full web address. Such type of link is absolute
as it specifies both the protocol name i.e. “http” and the hostname i.e. www.w3.org. the relative link can
only link to a page from the same site.
If you were linking to a page in the same folder, the href would be just page1.html” as sown below.
<a href=”page1.html”>
TARGET: the target attribute helps in opening a web page. The value, “blank” opens the webpage in a
new browser window. The value “top” opens the links webpage in the currently active browser window.
If you want to open the webpage in a new window, following code is to be used.
If you want to open the linked webpage in the same browser window is the current one, following code
is to be used:
<html>
</body>
</html>
The above code will open the web page of google on clicking the link “want to google” in the browser
window as the existing window. It will not open a new window to load the webpage of google.com
NAME: this attribute gives a name to the anchor tag. This attribute takes the value as “text string” this
helps in linking to a specific section within the webpage that has been named.
If you have a long webpage with a section about “sales” this section can be given a name using name
attribute as shown below. The purpose of the name is that another anchor can link to the named
anchor.
Linking to the named anchor. to link to a named anchor, add a hash mark (#) to the end of the uniform
resource locator of the webpage followed by the name of the section, it will open.
To link to a section named “salessection” within the page called named example. Html, the following is
used:
If the link is to a named anchor in the same webpage then you don’t need the file name of the webpage
just the hash mark and the name of the anchor:
To link to the sales section in our existing webpage, the following code is to be used:
START – specifies the starting number for a numbered list: START=”5” means the list will start with the
number 5.
TYPE=”A” “a” “I” “I” designates the appearance of the numbers preceding the items in the list example
Q.3. carefully study the webpage given below. Identify 10 tags that have been used in creating this
webpage and write the usage of each of them.
Ans. following are the 10 tags that are used to create the preceding web page along with their one line
descrition:
(a) <HTML> : refers to a structural tag that is used to mark the starting and ending of an HTML
document.
(b) <BODY> : refers to a structural tag that contains all the visible content, such as text images and link
of a webpage. If ends with </BODY>
(c) <P>: refers to a formatting tag that is used to begin a new paragraph it ends with </p>
(d) <B>: refers to a formatting tag that is used to boldface text in an HTML document. It ends with </B>
(e) <CENTER> refres to a formatting tag that is used to mark text as largest heading it ends with
<CENTER>
(f) <H1> refers to a formatting tag that is used to mark text as largest heading. It ends with </H1>
(g) <IMG>: refers to a formatting tag that inserts inline images on a web page.
(h) <OL> refers to a formatting tag that inserts numbered lists. It ends with </OL>
(i) <LI> : refers to a formatting tag that marks the list items in a numbered list. It ends with <LI>
(j) <A>: refers to a formatting tag that inserts hyperlink on a web page. It ends with </A>
Ans. <HTML>
<HEAD>
</HEAD>
<BODY>
<center> <H1> <fount face =”comic sans” color = “red”> smacking lollies </font> <H/1>
</center>
<i> <u> smacking lollies</u> </i> is a new chain of stores selling variety of candies and mouth watering
lollies.
,br> <br>
<li><a href=”west.html”> west Delhi </a> - lanak puri and Rajouri garden </li>
<li> <a href=”south.html> south Delhi </a> south extension and vasant kunj</li></ul>
</BODY>
</HTML>
TOPIC – 2 Tables
Objective Type Questions
[A] choose the correct alternative.
(a) <table>
(b) <DIV>
(c) <frameset>
(d) <TD>
(b) align
(c) L-align
(d) haling
(b) TD
(c) TH
(d) TC
Ans. (a) TR
(a) TROW
(b) TABLER
(c) TR
(d) ROW
Ans. (c) TR
(a) THEAD
(b) TBORDER
(c) TABLE
(d) TR
(a) <thead><body><tr>
(b) <table><tr><td>
(c) table><head><tfoot>
(d)<table><tr><tt>
8.which HTML command is used to aling the contents of the cell to right?
(d) none
(a) border
(c) bgcolor
(d) SRC
(a) <hr>
(b) <table>
(c) <td>
(d) tr>
Ans. true
Ans. false
3. the CELLSPACING attribute the tells the browser how much space to include between the wails of the
table.
Ans. true
Ans. true
Ans. true
Ans. false
7. settings for columns have more priority than settings for rows.
Ans. true
Ans. false
Ans. WIDTH
Ans. COLS
3. the ………… attribute tells the browser how much space to give data elements away from the walls of
eh cell.
Ans. CELLPADDING
Ans. Rowspan
5. align and valign are used with ……… tag to set alignment of data in a table.
Ans. <TD>
Ans. align=”attribute will be used when the CAPTION tag to put the table description at the bottom of
the table.
Ans. the text specified in the <caption> tag is displayed at center with respect to the table.
Ans. <Th> tag encloses the header object and makes the data bold face and center aligned while
<caption> tag is used to provide a text to the table so as to explain the contents of the table. it is
generally in bold, at center with respect to the table.
Q.4. how <TD> and <TR> are different from each other?
Ans.TR tag is used to define rows In a table. table rows are divided into table data with the <tb> tag. The
TD keeps the data in regular font & left align by default.
Ans. Rowspan attribute of the of the <table> tag merge rows vertically.
Q.6. write the code to align the contents of the cell to the top.
Q.7. what is the code to set the row with height 20% of the table?
Ans. the <caption> tag is used to specify the title for the table.
Q.12. what is the role of align attribute in <TABLE> and <TR> tag?
Ans. align attribute controls the text alignment within the cell, either horizontally or vertically.
Q.14. which HTML tags are used for marking a table and adding rows in a HTML documents?
Ans. (i) <Table> </table> tag are used for making a table.
(ii) <TR> </TR> are used for adding rows in a HTML a table.
Ans. align-defines the alignment of a table and table cell. Values – left, center, right. – used with to align
cell contents.
Values – 0 or 1
Ans. <table border=n>: here is any numerical value 1,2,3, etc. which specifies table border boldness.
(b) <table bgcolor=”n”>: here n stands for any color name/hex color code/rgb code which provides
background color to table.
(c) <td bgcolor=n”n”>: here n stands for any color name /hex color code/rgb code which provides
background color to cell.
(d) <td width=n>: here n is any numerical value 1,2,3 etc. which specifies table cell with width.
Ans. cellspacing: this attribute is used to set the minimum distance between two adjacent cells
cellspacing is the number of pixels between the table cells.
Cellpadding: this tag sets the margin within a cell, it is the pixel space inside the cells, i.e. the distance
between the cell content and the cell boundary.
Q.4. differentiate between the border and bordercolor attributes of the <table> tag.
Ans. border: this attribute draws a border around the table. it specifies the width of the border of a
table. if a table border is not given or its value of zero, then no border will be displayed there.
Bordercolor: this attribute is used to set the border color of a table. the default color of the border is
gray, but we can change it by assigning different color name to bordercolor attribute.
Ans. colspan: it is used to combine cells horizontally. It specifies the number of columns that the cell
spans across and shows them as a single cell.
Rowspan: it is used to combine cells vertically. It merges the number of cells vertically and shows them
as a single cell.
(i)
1 2 3
4 5 6
(ii)
1 2
3
Ans. (i) <html> <body>
<table border=1><tr>
<td rowspan=1><br></td>
<td rowspan=1><br>5<br></td>
<td rowspan=1><br>3<br>6</td>
</tr></table> </body></html>
<table border=1>
<tr> <td>3</td></tr></table>
<td>2</td></tr>
<tr><td>3</td></tr></table>
</body></html>
Q.7. differentiate between the <TR> and <TD> tags of HTML with the help of an appropriate example.
Ans. <TR> defines table row whereas, <TD> defines table data (cell).
Example:
<HTML>
<BODY>
<TABLE BORDER=1>
<TR>
<TD>1</TD>
<TD>2</TD>
</TR>
</TR> <TD>3</TD>
<TD>4</TD>
</TR>
<TABLE>
<BODY>
<HTML>
Q.8. What is the difference between the <TD> and <TH> tags?
Ans. <TD> is table data cell which aligned the text left by default in regular go it while <TH> is table
header which aligned the text center by default in bold face.
Ans. align- aligns the content in a table row bgcolor-specifies a background color for a table row.
Q.10. mention the tags that are required to be used to create the given table.
Student details
Name age Gender
Nishi 14 Female
rajat 16 Male
Ans. <TABLE>, <TD>, <TH>, <TR>
(i) background image (ii) background color (iii) table height (iv) table width
(ii) BACKGROUND
(iii) BGCOLOR
(v) VALIGN
(i)
A B
C
(ii)
A D
B E
C F
Ans. (i) <html>
<body>
<table> border=1>
<tr>
<td rowspan=”2”align=”center”>A</td>
<td>B</td.
</tr>
<tr>
<td> C </td>
</tr>
</table>
</body>
</html>
<body>
<table> border=1>
<tr>
<td>A</td>
<td>D</td>
</tr>
<tr>
<td>B</td>
<td>E</td>
</tr>
<tr>
<td> C </td>
<td>F</td>
</tr>
</table>
</body>
</html>
A C E
B D F
A B C D
B D F H
Ans. (i) (i) <html>
<body>
<tr>
<td> A </td>
<td> C </td>
<td> E >/td>
</tr>
<tr>
<td> B </td>
<td> D </td>
<td> F </td>
</tr>
</table>
</body>
</html>
<body>
<table> border=1>
<tr>
<td> A </td>
<td> B </td>
<td> C </td>
<td> D </td>
</tr>
<tr>
<td> B </td>
<td> D </td>
<td> F </td>
<td> H </td>
</tr>
<table>
</body>
</html>
A B C D
E F G H
Ans. (i) <html>
<body>
<tr>
<td> A </td>
<td> B </td>
<td> C </td>
</tr>
<tr>
<td> D </td>
<td> E </td>
<td> F </td>
</tr>
</table
</body>
</html>
<body>
<tr>
<td> A </td>
<td> B </td>
<td> C </td>
<td> D </td>
</tr>
<tr>
<td> E </td>
<td> F </td>
<td> G </td>
<td> H </td>
</tr>
</table
</body>
</html>
Q.16. Ms. Heard girl of the school, has to display the sequence of events of upcoming school’s a annual
day function on the school website. Help her in writing HTML code to create a table in HTML, as shown
in the given screenshot.
<BODY>
< TABLE BORDER = “2” <TR> <TH COLSPAN = “3”> ANNUAL SPORT DAY – SEQUENCE OF EVENTS
</TH> </TR>
<TR ALIGN = “CENTER”><TD> 8:00 – 9:00 AM </TD> 9:00 – 1:00 PM </TD> <TD> 1:00 PM – 2:00 PM
</TD> </TR>
<TR ALIGN=”CENTER”> <TD> OPENING CEREMONY </TD> <TD> PRIZE DISTRIBUTION </TD>
</TABLE></BODY></HTML>
<html><head><title>
Table
</title>
</html>
<body>
<table border=”1”>
One </th>
</table></body></html>
Ans.
TWO THREE
ONE Rose Lily
pausy Dahlia
Q.2. observe the following table and write the HTML code to generate it:
</title></1head>
<body>
<table border=”1”>
Serial no </th>
<th <rowspan=”2”>class</th>
</th></tr>
<td>35</td><td>10</td><td>6</td></tr>
</td>31</td><td>15</td><td>4</td>
</table></body></html>
Q.3. observe the below HTML table and write code in generate it
Ans. <HTML>
<DEAD>
<TITLE>marks </TITLE>
</HEAD>
<BODY>
<Table border=”3”>
<tr>
<th><bgcolor=”yellow”>marks</th>
</tr>
<tr bgcolor=”green”>
<th> English</th>
<th>math</th>
<th>economics</th>
</tr>
<tr>
<TD>67</TD>
<TD>77></TD>
<TD>92</TD>
</tr>
</table>
</body>
<html>
Q.4. write the HTML code to generate the following output of a table content exactly is the same format
as shown in the table:
<TH> opening balance </TH> </TR> <TR align = “center” valign = “middle”>
</BODY></HTML>
Ans. <HTML>
<HEAD>
</HEAD>
<BODY LINK = “Green” ALINK = “blue” VLINK = “RED”>
<CENTER>
</CENTER>
<LI> <A HREF = “two html”> TESERVATION</A><LI> <A HREF = “three html”>catering</A>
</UL>
</FONT>
<TR>3</TD><TD>CONTINENTAL</TD> </TR>
<TABLE>
</CENTER>
<BR>
</FONT>
</BODY>
</HTML>
Q.6. write HTML code to generate code for your school timetable.
Ans. <html>
<body>
<h4> school timetable:</h4>
<table border:”1”>
<tr>
<tr> <th rowspan = 6> hours </th><th> MON </th><th> TUN </th>
Science </td><td>arts</td><td>social</td></tr>
<tr> <td> lang </td> math </td><td>computer </td><td> science </td> <td>
Music </td></tr>
</table>
<body>
<html>
Q.7. write the HTML code using table tag for the following browser vies:
<th> <td> January </td> <td?> $80 </td> <td> $10</td> </tr>
</table>
</body></html>
(i) <TABLE>
(ii) <TR>
(iii) <TD>
(iv) <CELLSPACING>
(v) <CAPTION>
(ii) <TR>: this tag defines each horizontal row of table cells inside a table.
(iii) <TD>: this tag defines each table data cell within a row, into which text and/or graphics images may
be placed.
(v) <CAPTION>: when text is enclosed in the <CAPTION> ……. </CAPTION> command, it will be displayed
above the table, centered and wrapped if necessary.
Q.9. carefully study the web page given below. Identify 10 tags that have been utilized in creating this
web page and write their usage:
Ans. <HEAD>: the <HEAD> element carries information about the HTML web page, such as title of the
web page.
<TITLE>: the <TITLE> tag is used to assign the name to a web page.
<BODY>: the <BODY> tag is placed just after the </HEAD> tag.
<CENTER>: it is used to align the text in the center of the web page.
cbsepractice.in