LISTS, TABLES AND FORMS
TYPE A: Very Short Answer Questions
|
1
|
What type of lists are supported by HTML?
|
|
Ans.
|
There are three types of lists are
supported by HTML.
1. Unnumbered
2. Numbered
3. definition
|
|
2
|
Which three tags let you create the definition lists?
|
|
Ans.
|
1.
<DL> - Definition list
2.
<DT> - Definition term
3.
<DD> - Definition description
|
|
3
|
Which two tags let you create the
(i) Unnumbered
list? ii) Numbered list?
|
|
Ans.
|
(i) <UL>
(ii) <OL>
|
|
4
|
What is the table? Which tag is used to create tables in HTML?
|
|
Ans.
|
A table is a collection of rows and
column. <TABLE> tag is used to create tables in HTML.
|
|
5
|
Which attributes are used to give border to table?
|
|
Ans.
|
BORDER attribute is used to give
border to table.
|
|
6
|
Which attributes lets you control the display of select border
sides of a table?
|
|
Ans.
|
FRAME attribute lets you control
the display of select border sides of a table.
|
|
7
|
Which attribute is used to control the inside table border?
|
|
Ans.
|
RULES attribute is used to control the
inside table border.
|
|
8
|
How is spacing in cells of table controlled?
|
|
Ans.
|
To control the spacing in cells,
The CELLSPACING and CELLPADDING attributes can be used.
|
|
9
|
What is the role of ALIGN attribute of <TABLE> tag?
|
|
Ans.
|
Align attribute is used to align
the table. It specifies the alignment of a table according to the surrounding
text. It can
have values left, right or center.
|
|
10
|
What is the use of having a SUMMARY attribute in <TABLE>
tag?
|
|
Ans.
|
The summary attribute specifies a
summary of the content of a table. It makes no visual difference in ordinary
web
browsers.
|
|
11
|
How can you specify following in a table?
(i) Background
image ii) Background colour.
(ii) Table
height vi) Table width.
|
|
Ans.
|
(i) <TABLE BACKGROUND = “D:\Bg3.jpg”>
(ii) <TABLE BGCOLOR = “RED”>
(iii) <TABLE HEIGHT = 100>
(iv) <TABLE WIDTH = 70>
|
|
12
|
Which tag is used to specify
(i) Table
data? Ii) Table header? iii) Table row?
|
|
Ans.
|
(I) <TD>
(II) <TH>
(III) <TR>
|
|
13
|
Name the attributes used for following?
(i) Setting
the cell width ii) Setting cell’s
background image iii) Setting
cell’s background colour
vi ) Changing
the cell span v) Aligning cell contents vertically.
|
|
Ans.
|
(i) WIDTH
(ii) BACKGROUND
(iii) BGCOLOR
|
|
|
(iv) ROWSPAN AND COLSPAN
(v) VALIGN
|
|
14
|
What for are <TH> and <TR> tags used?
|
|
Ans.
|
<TH> is used for table header
and <TR> is used for table row.
|
|
15
|
A set of header rows is defined using _______________ tag.
|
|
Ans.
|
A set of header rows is defined
using < THEAD > tag.
|
|
16
|
What are forms?
|
|
Ans.
|
Forms are means to collect
information/data from the site-visitor. It is done with the help of controls
that collect the
information and send it over.
|
|
17
|
What do you understand by controls in forms?
|
|
Ans.
|
Users interact with forms through
named controls. A control’s “control name” is given by its name attribute.
Each
control has both an initial value
and a current value, both of which are character strings.
|
|
18
|
Name different control types supported by HTML forms.
|
|
Ans.
|
1. Buttons
2. Checkboxes
3. Radio buttons
4. Menus
5. Password
6. Text input
7. Hidden controls
|
|
19
|
Write the tags to define the following:
(i) A
text box
(ii) A
text area
(iii) A
radio button
(iv) A
check box
(v) A
password box
(vi) A
pop up box
(vii) Submit
button
(viii) A
label.
|
|
Ans.
|
(i) <INPUT type = “text” >
(ii) <TEXTAREA>
(iii) <INPUT type = “radio”>
(iv) <INPUT type = “checkbox”>
(v) <INPUT type = “password”>
(vi) HTML does not have any pop component, for this we can use
any scripting language.
(vii) <BUTTON type = “submit”>
(viii) <label for="male">label
name</label>
|
TYPE B: Short Answer Questions
|
1
|
Differentiate between ordered and unordered lists.
|
|
Ans.
|
The < ol > tag is used for defining ordered
or numbered lists. In these lists, a number or letter appears in front of
each list item.
The < ul > tag is used for defining
unnumbered lists (or unordered lists). They have a special bullet symbol in
front of
each item.
|
|
2
|
How will you nest an unordered list inside an ordered list?
|
|
Ans.
|
<html>
<head>
<title> set of list
</title>
</head>
<body>
|
|
|
<ol>
<li>First order point
<ul>
<li>First unordered list
item</li>
<li>Second unordered list
item</li>
</ul>
</li>
<li>Another ordered
point</li>
</ol>
</body>
</html>
|
|
3
|
How would you indent a single word and put a square bullet in
front of it?
|
|
Ans.
|
<ul
type="square"><li>example</li></ul>
(Putting the type="square"
in the <li> tag would give the same result because there's only one
item in this list.)
|
|
4
|
Write the HTML to create the following indentation effect:
Apple pie,
pudding,
and pancake,
all begin with an A.
|
|
Ans.
|
<html>
<head>
<title>example </title>
</head>
<body>
<dl>
<dt>Apple pie,</dt>
<dd>pudding,</dd>
<dl>
<dd>and
pancake,</dd>
</dl>
All begin with an A.
</dl>
</body>
</html>
|
|
5
|
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>
<title>example
</title>
</head>
<body>
<DL>
<DT>glunch
<DD>a look of disdain,
anger, or displeasure.
<DT>glumpy
<DD>sullen, morose, or
sulky.
</DL>
</body>
</html>
|
|
6
|
Write code to produce following HTML tables?
i) B ii) A D
A
C B E
C F
|
|
|
iii)
|
A
|
C
|
E
|
iv)
|
A
|
B
|
C
|
D
|
|
|
B
|
D
|
F
|
B
|
D
|
F
|
H
|
||||
|
A B C vi)
v) D E F
|
||||||||||
|
A B C D B F G H
|
||||||||||
|
Ans.
|
(i)
<html>
<body>
<table
border>
<tr><td
rowspan="2" align="center">A</td>
<td
>B</td>
</tr>
<tr>
<td
>C</td>
</tr>
</table>
</body>
</html>
(ii)
<html>
<body>
<table
border="1" frame="void" >
<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>
(iii)
<html>
<body>
<table
border="1" frame="lhs" >
<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>
(iv)
<html>
<body>
<table
border="1" frame="above" >
<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>
(v)
<html>
<body>
<table
frame="border" rules="cols">
<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>
(vi)
<html>
<body>
<table
border="1" frame="box" rules="groups">
<tr>
<td>A</td>
<td>B</td>
<td>C</td>
<td>D</td>
</tr>
<tr>
<td
>B</td>
<td
>F</td>
<td>G</td>
<td>H</td>
|
|
</tr>
</table>
</body>
</html>
|
|||||
|
7
|
Write HTML to
produce
a table
having a background image
image.gif stored in
pictures folder of D: drive and
having height of 200 pixels and
width
of 130 pixels.
|
|||||
|
Ans.
|
<html>
<body>
<table
border="3" background="D:\pictures\image.jpg" height=200
width=130>
<tr>
<td>
cell </td>
<td>
cell </td>
</tr>
<tr>
<td>
cell </td>
<td>
cell </td>
</tr>
</table>
</body>
</html>
|
|||||
|
8
|
Create
following HTML table
|
|||||
|
|
A
C G
|
B
|
|
|
||
|
D
|
E
|
F
|
||||
|
H
|
||||||
|
Ans.
|
<html>
<body>
<table
width="132" border="1">
<tr
align="center">
<td
width="22" rowspan="3">A<br/>C<br
/>G<br /></td>
<td
colspan=3 align="center">B</td>
</tr>
<tr
align="center">
<td
width="29">D</td>
<td
width="24">E</td>
<td
width="29" rowspan=2>F</td>
</tr>
<tr align="center">
<td
colspan=2 align="center">H</td>
</tr>
</table>
</body>
</html>
|
|||||
|
9
|
Create a table
having three
header rows with
yellow
background colour, five table-body rows having pink colour
and two
footer rows having cyan
colour. Assume table
contents on your
own.
|
|||||
|
Ans.
|
<html>
<body>
<table
border="1">
<thead
bgcolor="yellow">
<tr>
<td>header
1</td>
</tr>
<tr>
<td>
header 2 </td>
</tr>
<tr>
|
|||||
|
|
<td>
header 3 </td>
</tr>
</thead>
<tbody
bgcolor="pink">
<tr>
<td>body
1</td>
</tr>
<tr>
<td>
body 2</td>
</tr>
<tr>
<td>body
3 </td>
</tr>
<tr>
<td>body
4</td>
</tr>
<tr>
<td>body
5</td>
</tr>
</tbody>
<tfoot
bgcolor="cyan">
<tr>
<td>footer
1</td>
</tr>
<tr>
<td>
footer 2</td>
</tr>
</tfoot>
</table>
</body>
</html>
|
|
10
|
Write HTML code
to produce following controls Grade :
|
|
Ans.
|
<html>
<body>
<form>
Grade:
<input
type="radio" name="grade" value="A"/>A
<input
type="radio" name="grade" value="B"/>B
<input
type="radio" name="grade" value="C"/>C
<br>
Subjects:
<input
type="checkbox" name="s1"
value="english">English
<input
type="checkbox" name="s2"
value="maths">Maths
<input
type="checkbox" name="s3" value="computer">Computers
<input
type="checkbox" name="s4"
value="account">Accounts
<input
type="checkbox" name="s5" value="eco">Economics
<input
type="checkbox" name="s6"
value="bo">Business Studies.
</form>
</body>
</html>
|
|
11
|
Write HTML code
to produce these controls
(i)
A text box
(ii) A text area with
10 rows and 30 columns
|
|
|
(iii)
A password
text box
(iv) A pop up
box to choose class from it.
|
|
Ans.
|
<html>
<body>
<form>
Name:
<input
type="text" name="f_name" >
<br>
<textarea
rows="10" cols="30" name="add">
write
address here.....
</textarea>
<br>
password:
<input
type="password" name="pwd" >
<br>
Class:
<select
name="class">
<option
value="class10">Class 10</option>
<option
value="class11">Class 11</option>
<option
value="class12">Class 12</option>
</select>
</form>
</body>
</html>
|
|
1
|
Create web pages to display following sets of lists:
 |
|
Ans.
|
<html>
<head>
<title>
set of list
</title>
</head>
<body>
<table
width="1000">
<tr>
<td>
<ol>
<li>
one
<ol
type="a">
<li>uno
<li>hanna
</ol>
<li>
two
<ol
type="a">
|
|
|
<li>dos
<li>dool
</ol>
<li>
three
<ol
type="a">
<li>tres
<li>set
</ol>
</ol>
</td>
<td>
<ul>
<li>Chevy
<ul
type="circle">
<li>Cavaler
<li>Malibu</ul>
<li>Ford
<ul
type="circle">
<li>Escort
<li>F100</ul>
<li>Mazda
<ul
type="circle">
<li>626
</ul>
</ul>
</td>
<td>
<dl>
<dt><u>Fruit</u>
<dd>Applies,
Oranges, Pears, Plums
<dt><u>Vegetables</u>
<dt> Com
<dd>on
the cob
<dd>cream
<dt> Carrots
<dt> Green
Beans
</dl>
</td>
</tr>
</table>
</body>
</html>
|
|
2
|
Create a webpage
to display a
table as given
below:
 |
|
Ans.
|
<html>
<body>
<table
border="1">
<thead
bgcolor="pink" align="center">
|
|
|
<tr>
<td>Decimal</td>
<td>English</td>
<td>Hindi</td>
<td>Spanish</td>
<td>Korean</td>
</tr>
</thead>
<tbody
align="center">
<tr>
<td>1</td>
<td>One</td>
<td>Ek</td>
<td>Uno</td>
<td>Hanna</td>
</tr>
<tr>
<td>2</td>
<td>Two</td>
<td>Dou</td>
<td>Dos</td>
<td>Dool</td>
</tr>
<tr>
<td>3</td>
<td>Three</td>
<td>Theen</td>
<td>Tres</td>
<td>Set</td>
</tr>
<tr>
<td>4</td>
<td>Four</td>
<td>Chaar</td>
<td>Quatro</td>
<td>Net</td>
</tr>
<tr>
<td>5</td>
<td>Five</td>
<td>Paanch</td>
<td>Cinco</td>
<td>Daset</td>
</tr>
</tbody>
</table>
</body>
</html>
|
|
3
|
Create a form as given below by using different Form tags and attributes.
|
|
Ans.
|
<html>
<head>
<title>
form
</title>
</head>
<body>
<h1>My
Guest Book</h1>
<form
method=post>
Please let me
know what you think of my web pages. Thanks!
<br><br>
What is your
name? &
nbsp;
<input
type="text" id="name"><br> What is your e-mail
address:
<input
type="text" id="name"><br><br>
Check all
that apply:
<br>
<input
type="checkbox" name="s1" value="v1">I realy
like your Web Site.
<br>
<input
type="checkbox" name="s2" value="v2">One of
the best site I've seen.
<br>
<input
type="checkbox" name="s3" value="v3">I have
no taste so your site
didn't do
much for me.
<br><br>
Choose the
one thing you love best of my pages:
<br>
<input
type="radio" name="grade" value="A"/>That
gorgeous picture of you and your
dogs.
<br>
|
|
|
<input
type="radio" name="grade" value="B"/>The
inspiring recap about your childhood.
<br>
<input
type="radio" name="grade" value="C"/>The
detailed list of your hobbies.
<br><br>
Imagine my
site as a book, vedio, or album.<br>
What do you
think about my site?<br>
<textarea
rows="4" cols="40">ADD MORE DETAILS ABOUT YOUR
HOBBIES! ADD PICTURES OF YOUR CHILHOOD
ADD YOUR
FAVOURITES
</textarea>
<br>
<br>
<input
type="button" value="Click here to submit">
</form>
</body>
</html>
|
|
4
|
Create a webpage
that receives pizza
orders through a
web form as shown
below:
 |
|
Ans.
|
<html>
<head>
<title>
form
</title>
</head>
<body>
<h1>Pizza
Factory</h1>
<hr>
<form
method=post>
<table>
<tr>
<td>
<h3>Pizza
order Form</h3>
</td>
</tr>
<tr>
<td
width="200"> Name
</td>
<td>
|
<input
type="text" id="name">
</td>
</tr>
<tr>
<td>
Address
</td>
<td>
<input
type="text" id="name">
</td>
</tr>
<tr>
<td>
<h3>Size</h3>
</td>
<td>
<h3>Toppings</h3>
</td>
</tr>
<tr>
<td>
<input
type="radio" name="size" value="A"/>Small
<br>
<input
type="radio" name="size" value="B"/>Medium
<br>
<input
type="radio" name="size" value="C"/>Large
<br><br>
</td>
<td>
<input
type="checkbox" name="s1" value="v1">Cheese
<br>
<input
type="checkbox" name="s2" value="v2">Olives
<br>
<input
type="checkbox" name="s3" value="v3">Pepperotn
<br>
<input
type="checkbox" name="s3" value="v3">Bacon
</td>
</tr>
<tr>
<td>
<input
type="button" value="Process Order">
</td>
<td>
<input
type="button" value="Clear">
</td>
</tr>
</table>
<textarea
rows="5" cols="50">
</textarea>
</form>
</body>
</html>
