1. Fill in the blanks:
a. The Gif image format uses a
maximum of 256 colors and a combination of these to create more colors.
b. The src attribute of the <img>
tag specifies the URL of an image.
c. The <img> tag is a/an Empty
element.
d. The value of the height attribute of an <img> tag is specified
in Percentage or Pixel.
e. A Table header <th>
arranges data in rows and columns.
f. The Table tag indicates that
the cell is a header for a column or a row.
g. The default value of caption-side property is Top.
h. The Cell padding property
specifies the space between the border and content in a table.
i. The value of src attribute is URL
j. The Text-Align property sets
the horizontal alignment of text in a table.
2. Write True or False:
a. Web browser use only the GIF format. FALSE
b. PNG format works best for images with transparencies or low color count.
TRUE
c. The <img> tag is an empty tag. TRUE
d. The alt attribute cannot be used for <img> tag. FALSE
e. The <td> tag specifies an individual block or a cell in a table
row. TRUE
f. The value of which attribute for the <img> tag can be specified
in pixel only. TRUE
g. The border properties can be used with <td> and <tr>
tags. TRUE
h. The text-align property sets the horizontal alignment of text in a
table. TRUE
i. Graphics can be inserted in a table cell using the <image>
tag. FALSE
j. The default value of the border – collapse property is ‘separate’. TRUE
3. Choose the correct options:
a. The ___ tag specified an image to be displayed in an HTML5 document.
<img>
b. src is an attribute of the ____ tag.
<img>
c. The vertical – align property of the <td> tag can have the
value ____
All of these ( top, bottom, middle)
d. The ____ attributes specifies an alternate text for an image.
alt
e. which of the following is the best format for photographs?
JPEG
f. The main tag used to define a table in HTML5 is ___
<table>
g. Which of the following tags is used to define an individual block or
cell in a table row in an HTML5 document?
<td>
h. The default value of empty – cells property is
show
i. Which of the following properties are used with the <td> tag?
All of these ( text-align, vertical –
align, padding)
Click To Top
1. Short answer type questions:
a. Give the full form of GIF and PNG.
CLICK ME 👈FOR FULL FORM
b. Name the attribute
of the <table> tag that is used to define background color.
Attribute of <table> tag used to define background color is <table background = “red”>.
c. Expand the
following:
i) <td> : Table data tag ii) <th> : Table header Tag
d. Name the tag used
to define the title to the table.
The tag used to defined the title to the table is <caption> tag.
e. What is the use of
the <th> tag.
<th> is use as a table header tag. It indicates that the cell is a header for a column or a row.
f. What are the
values in which the width and the height property of a table can be given?
The values in which the width and the height property of a table can be given as percentage (%) or Pixel (px).
g. Which table
property is used to specify the placement of a table caption?
Caption-side is the table property used to specify the placement of the table caption.
h. What is the use of
empty-cells property?
Empty-cells property is used to specify whether to display borders and background for empty cells in a table or not.
i. Name the property
used to set the vertical alignment of text in a table.
Vertical- align property is the property used to set the vertical alignment of the text in a table.
j. Can you insert an
image in a table cell?
Yes, we can insert an image in a
table cell.
2. Long answer questions:
a. Differentiate
between GIF and JPEG formats.
The different between GIF and
JPEG format are given below
GIF |
JPEG |
PNG |
i)
GIF stand for Graphic Interchange Formate |
i) JPEG
stand for Joint Photographic Experts Group |
i) PNG
stand for Portable Network Graphic |
ii)
it is a lossless compression method |
ii) It is a lossy
compression method |
ii) It uses lossless
compression algorithms |
iii)
It supports only 8-bit color images |
iii) It
supports 24- bit full color images |
iii)
PNG image is a high quality |
iv)
It contains 256 colors |
iv) It contains 1
million colors. |
iv) PNG image is
generally larger than JPEG image. |
v)
GIF uses its limited color details to compress the images |
v) JPEG
minimizes the file size by loosing the details of the image. |
v) PNG
image supports transparency in images |
vi)
GIF image is of high quality |
vi) JPEG image are
used in photography |
vi) PNG images are
generally used in icon creation |
vii)
GIF image support animation |
vii)
JPEG image does not support animation |
vii)
PNG use .png extension |
viii)
GIF image use .gif extension |
viii) JPEG image use
.jpeg or .jpg extension |
|
b. What is the use of
the <img> tag? Is it an empty or a container element? Explain any two
attributes used with this tag using an example.
<img> tag is used to
specify an image to be displayed in an HTML5 document.
Yes, it is an empty element or
Container tag.
The two attributes used in<img>
tag is:
i) src: This attribute of <img> tag
specifies the path of an image file. Its value is written in URL. Example: <img src = “image.jpg”>
ii) alt: This attribute of an <img>
tag specifies the alternate text for an image. This text is displayed when the
graphics feature is turned off in the browser.
Example: <img src = “image.jpg” alt= “Image not available”>
c. What is the
different between <tr> and <td> tags?
The different between <tr> and
<td> tag is that:
<tr> tag is used to define
a horizontal row of a cells. There must be at least one row in the table. Whereas,
<td> tag is used to specify
an individual block or cell in a table row.
OR
<td> tag defines a standard cell in an HTML table, it will contain data for the table, and not for table headings. This tag is also commonly referred to as the <td> element.
d. Write the use of
the following properties.
i) border-spacing ii) caption iii) border- collapse
Border-Spacing: This property is used to specifies
the distance between the border of adjacent cell.
Caption Side: This property is used to
specifies the placement of table caption.
Border- Collapse: Specifies whether table
borders should be collapsed or not.
e. How can you
specify the height and width of a table? Explain with an example.
We can specify the height and
width of the table by the height and width property of the <table> tag.
Its values are in Percentage (%) or Pixel (px).
Example: <table height= “50px”, width = “100%”>.
f. Explain the border
properties that can be used with the <table> tag. Can you apply these
properties to <td> and <tr>?
The border attribute is very
important to use in the formation of table, if the border size will not be
added in the table border attribute, then the data that is defined on the table
will not show in the tabular form.
Border attribute is generally
used to show our data in the tabular form and sequential form or we can say
that in the manner order, that is for the data and information.
Yes, we can apply these
properties to the <td> and <tr> tags, using CSS <style> tag
for our table
g. Differentiate
between text-align and vertical align properties. What values can be assigned
to these properties?
The different between text align and vertical align properties are given
below:
TEXT-ALIGN PROPERTY |
VERTICAL-ALIGN PROPERTY |
i)
It sets the horizontal alignment of text in a table ii)
The value of this property is left/right/center |
i) It
sets the vertical alignment of text in a table. ii) The
value of this property is Top/Bottom/Middle. |
h. Which properties
will you use to change the background color and the text color for the heading
row?
To change the background color for the heading row we will use the bg-color attribute and to change the text color of the heading row we must use text-color property.
i. What is the use of
the padding property? Which HTML tag uses this property?
Padding property is use to generate
space around an elements content, inside of a defined border. Its values are in
pixels.
The <td> tag uses this property.
j. What is the use of
the empty -cells property? What different values can be assigned to this
property?
The use of empty cells properties
is that it selects empty table cells for the purpose of specifying whether or
not to display borders and background on them. In other words, it tells the
browser whether or not to draw border around a table cell or fill in the
background when that cell contain no content.
The empty cells property has two
primary values:
i) show : Display a border and
background on a empty cell.
ii) Hide: Does not display a
border or background on an empty cell.
Application Based Questions:
1. Tavishu wants to insert an image in a web page:
a. Which tag will he use to insert the image?
b. Name any two attributes of this tag and their use.
c. Name the attribute of this tag for specifying the URL of an image.
Explain with an example.
Ans: a) The tag he will use to insert an
image is <img>.
b) The two attributes of this tag
are:
i) src: This attribute is use to
specifies the URL of an image file.
ii) height: This attribute is use
to specify the height of an image.
c) The attribute of this tag for
specifying the URL of an image is src.
Example: <img src =
“image.Jpg”>
2. Identify the error(s) in the following code and then write the
correct code:
<style type=”text/css”>
Image {border-size: 6px solid green; width: 220px;
height: 200px}
h2{transform: uppercase}
</style>
Ans: <style type=”text/css”>
Image {bordersize: 6px solid
green; width: 220px; height: 200px}
h2{ text-transform: uppercase}
</style>
3. Observe the given code and answer the questions following it:
<style type = “text/css”>
Table
{
border – collapse: separate;
border-spacing: 15px 25px;
}
</style>
a) Will the above code display a borer around the table?
b) Which properties can you use to get the table border?
c) What changes will you make in the above code to get a solid
orange-colored border of 3px?
Ans: a) No, the above code will not
display a border around the table.
b) To get the table border we can
use the border property.
c) We will add a new code i.e,
border: 3px solid orange.
4. Observe the given code and answer the question following it:
<style type = “text/css”>
td
{
Padding: 12px
text- align: center
vertical-align: middle
}
th
{
background-color: pink
color: blue
}
</style>
a) What will be the background and text color for the table’s heading row?
b) Which properties have been used to specify the background and text
color?
c) What is the space between the border and the cell content known as?
Which property has been used to specify this value?
Ans: a) The background color for the table’s heading row will be pink
&
The text color for the table’s heading row will be blue.
b) The property that have been used to specify the background color is
background-color property and the property that have been used to specify the
text color is text color property.
c) The space between the border and the cell content is known as padding.
The property that has been used to specify this value is cell padding.
5. Observe the code given below:
th
{
background-color: pink
color: blue
}
tr
{
background-color: pink
color: blue
}
Can you suggest an alternate way of writing the above code?
Ans: th,tr {background-color: pink, color: blue}
0 Comments