Introduction:
Hi there! Are you prepared to solve the web development problems? The focus of our Class 10 Computer Science Chapter 2 Question Answer Guide is on simplifying HTML and CSS3. Whether you’re a student preparing for an exam or just curious, we’ve broken down and digested Chapter 2 questions.
HTML5 AND CSS3
Table of Contents
What is HTML?
HTML, or HyperText Markup Language, is a standard markup language used for creating and designing the structure of web pages. It consists of various elements and tags that define the content, layout, and formatting of a document on the World Wide Web.
Why HTML?
HTML is the foundation of web development, providing a standardized way to create and structure content on the internet. It allows for the seamless integration of text, images, multimedia, and hyperlinks, enabling the creation of interactive and visually appealing web pages.
History of HTML
HTML was first introduced by Tim Berners-Lee in 1991 as a way to share documents among scientists at CERN. Over the years, it has evolved through different versions, with the latest being HTML5, which includes advanced features for multimedia, graphics, and improved accessibility.
Features of HTML
- It is a simple language. It can be easily understood and modified.
- It is very easy to make an effective presentation with HTML because it has a lot of formatting tags.
- It is a markup language that provides a flexible way to design web pages along with the text.
- It facilitates programmers to add a link to web pages (by using an HTML anchor tag), so it enhances the interest of browsing for the user.
Computer Science Class 10 Book PDF
HTML Tags
HTML tags are elements used to define and structure content within a document. They consist of an opening tag, content, and a closing tag. For example, <p> is a paragraph tag. The HTML tags can be categorized as:
Container tags: These tags come in pairs, i.e., they have both opening and closing tags. A tag is said to be a paired tag if it, along with a closing tag, appears at the end.
Example: <HTML>…</HTML>, <BODY>…</BODY>, etc.
Empty tags: It is also called a singular tag. These types of tags don’t have closing tags.
Example: <BR>, <HR>, etc.
How are comments useful?
Comments in HTML are useful for several reasons.
Improving code readability and understandability: Comments help you remember the rationale behind your code, especially for complex sections or algorithms written months ago.
Documenting code functionality and behavior: Comments act as embedded documentation, explaining what functions and modules do, how they interact, and any specific assumptions or limitations.
Basic Structure Of HTML Document
The basic structure of an HTML document includes the following:
<!DOCTYPE html>
<html>
<head>
<!– Metadata goes here –>
</head>
<body>
<!– Content goes here –>
</body>
</html>
<!DOCTYPE html> declares the HTML version.
<html> is the root element.
<head> contains metadata (e.g., title, links to stylesheets).
<body> holds the content displayed on the webpage.
What are Cascading Style Sheets? Name the different methods available for applying
Style rules in an HTML document.
Cascading Style Sheets (CSS) is a language that defines how HTML elements are to be displayed on a web page. There are several methods for applying style rules to an HTML document:
- Inline Styles: It can be applied directly to individual HTML elements using the style attribute.
Example:
<p style=”color: red;”>This text is red.</p> - Internal Styles: It is defined within the <head> section of an HTML document using a <style> tag.
Example:
<head>
<style>
p { color: blue; }
</style>
</head> - External Styles: This stylesheet is stored in separate.css files and linked to HTML documents using the <link> tag within the <head> section.
Example:
<head>
<link rel=”stylesheet” href=”styles.css”>
</head>
Differentiate between Internal CSS and External CSS.
Internal CSS is embedded directly within the HTML file, while external CSS is stored in a separate file and linked to the HTML document. The choice between them depends on the project’s size, structure, and the need for code organization and reusability.
| Internal CSS | Internal CSS |
| Placed directly within the HTML document using <style> tags in the <head> section. | Stored in a separate file with an .css extension. Linked to HTML using <link> tags in the <head> section. |
| It applies only to the document it’s defined in | It can be applied to multiple HTML documents |
| Not easily reusable; code duplication needed | Highly reusable, same styles used across pages |
| May mix with HTML; less organized for complex styles | Encourages code separation and makes it easier to read and maintain |
Part II (List, Tables And Images)
Exercise Questions
I. FILL IN THE BLANKS:
1. By default, the unordered list items are marked with _____.
Ans: Bullet.
2. ____ attribute of the list lets you reverse the order of the item list.
Ans: REVERSED.
3. A list inside another list is called a ___ list.
Ans: Nested.
4. A collection of related elements is called ___.
Ans: List.
5. ___ property of table defines the space between the content of the table and the border.
Ans: CELLPADDING.
6. The <img> tag is a ___ tag, which means it has no closing tag.
Ans: Empty.
7. _____ is an attribute of the <img> tag which specifies the location or URL of the image to be displayed.
Ans: SRC.
8. ____ attribute is used to give a border to an image.
Ans: BORDER.
II. MULTIPLE CHOICE QUESTIONS:
1. Which tag is used for List items?
- <OL> (b) <LI> (c) <UL> (d) <DL>
Ans: (b) <LI>
2. Which element contains definition?
(a) <DL> (b) <DD> (c) <DT> (d) <UL>
Ans: (b) <DD>.
3. Which of the following can’t be the value of list-style-type?
(a) Square (b) Circle (c) Ellipse (d) Disc
Ans: (c) Ellipse
4. Which attribute is only used with <o1>?
(a) Value (b) type (c) compact (d) start
Ans. (4) start
5. With the help of which tag, is a row defined in HTML?
(a) <row> (b) <tr> (c) <row-table> (d) <tablerow>
Ans. (b) <tr>
6. By using which of the following options, the border of a table can be collapsed?
(a) border-collapse: collapse (b) table-border: collapse
(c) border: collapse (d) table-border-collapse: collapse
Ans: (a) border-collapse: collapse.
7. Web browsers display images in the following format.
(a) XBM (b) GIF (c) JPEG (d) All of these
Ans: (4) All of these.
8. The correct HTML code for inserting an image is —
(a) <img href = ”image.gif”> (b) <img> image.gif</gif>
(c) <img src = “image.gif”> (d) <image src = “image.gif”>
Ans: (3) <img src = “image.gif”>.
9. Src attribute used with <img> tag stands for.
(a) screen (b source (c) screen resolution count (d) structure
Ans: (b) source.
10. Alt attribute allows:
(a) addition of an alternate hyperlink.
(b) addition of a border to an image.
(c) use of an alternative image in place of the specified image.
(d) addition of alternative text about an image.
Ans: (d) addition of alternative text about an image.
III. ANSWER THE FOLLOWING:
1. Differentiate between the <OL> and <UL> tags.
Ans.
| Feature | OL (Ordered List) | UL (Unordered List) |
| Purpose | Show things in a specific order | Show things without a specific order |
| Formatting | Numbers each item (1, 2, 3, etc.) | Uses bullets (•) |
| Use for | Steps, recipes, timelines, and rankings | Grocery lists, ideas, and features |
2. Write the syntax for using the list-style-type property.
Ans:
Syntax:
selector {
list-style-type: value;
}
Example:
ul {
list-style-type: square; /* Use square bullets for all unordered lists */
}
ol.custom-list {
list-style-type: upper-roman; /* Use uppercase Roman numerals for this specific ordered list */
}
3. Define Padding property.
Ans: Padding is a CSS property that creates space around the content of an element, inside its borders. It’s like adding a cushion or buffer between the content and the element’s edge. This spacing enhances readability and visual appeal and helps separate elements for a better layout.
The syntax for setting the padding property for all four sides of a <p> element to 15px is as follows:
p {
padding: 15px; /* Adds 15px of padding around all sides of paragraphs */
}
4. What is a description list? Define the different tags used to create a description.
Ans: A description list in HTML is created using the <dl> (description list) element. It is used to group a set of terms (words or phrases) along with their corresponding descriptions.
It starts and ends with <dl> and </dl> tags.
● The <dl> tag is used in defining the terms.
● The <dd> tag is used in describing each term.
5. What is the use of a type attribute with an unordered list?
Ans: The type attribute is used with the <ul> (unordered list) element in HTML to specify the style of the marker or bullet points for list items.
In traditional HTML, the type attribute for an unordered list (<ul>) could take one of the following values:
- disc: This is the default value. It uses filled circles as markers for each list item.
- circle: This uses unfilled circles as the marker for each list item.
- square: This uses filled squares as the marker for each list item.
6. State the use of any two properties that you use to enhance the appearance of a table.
Ans: Here are two commonly used properties that are used to enhance the appearance of a table:
- Border Property: The border property is used to set the border of the table and its elements (cells, rows, and columns).
- Padding Property: The padding property is used to define the space between the content of a table cell and its border.
7. How are images added to an HTML document?
Ans: Images can be added to an HTML document using the <img> (image) element. The <img> element is an empty, self-closing tag that does not require a closing tag.
Here’s the basic syntax for adding an image:
<img src=”image-source” alt=”alternative-text” width=”width-value” height=”height-value”>
Part – III (LINKS, FRAMES AND FORMS IN HTML 5)
I. FILL IN THE BLANKS:
1. The web pages of a website are linked to each other using _____.
Ans: Hyperlink.
2. The attribute ____ creates a hyperlink between two or more HTML codes.
Ans: Href.
3. When you move the mouse pointer over a link, the mouse pointer changes its shape from an arrow to a ___.
Ans: Pointing hand.
4. The ___ attribute of the <audio> tag indicates that you can replay the audio file once it is finished.
Ans: Loop.
5. The small rectangular areas created in the main browser window are known as _____.
Ans: Frames.
6. The ____ attribute of the frame tag tells the browser which HTML page to load into that frame.
Ans: Src.
7. _____ attribute of the frame tag attaches the default URL.
Ans: Src.
8. ____ allows multiple HTML documents to be presented as independent windows within one browser window.
Ans: Inline frame.
9. The ____ tag collects the information from the user.
Ans: Input.
II. MULTIPLE CHOICE QUESTIONS:
1. A ___ is a word, a group of words, or an image that can be used to jump to another document on the same website or another website.
(i) Hyperlink (ii) URL (iii) Address (iv) none of these
Ans: (i) Hyperlink.
2. The ___ attribute of the <a> tag is used to set the URL of the target resource.
(i) src (ii) href (iii) Controls (iv) none of these
Ans: (ii) href.
3. Which of the following can be embedded in a web page?
(i) Audio (ii) Video (iii) Both (i) and (ii) (iv) None of these
Ans: (iii) Both (i) and (ii).
4. The _____ attribute of the <video> tag plays the video file automatically on loading a web page.
(i) controls (ii) Autoplay (iii) Height (iv) none of these
Ans:(ii) Autoplay.
5. _____ tag is used to create a textbox, radio button, and checkbox on the web page.
(i) <OPTION> (ii) <INPUT> (iii) Both of these (iv) None of these
Ans: (ii) <INPUT>.
III. APPLICATION-BASED QUESTIONS:
1. Rohan wants to divide a web page into four sections. Which tag should he use to accomplish this?
Ans: Rohan must use the <iframe> tag to divide a web page into four sections.
Syntax:
<iframe src = “url” title = “description”> </iframe>.
2. Rahim is creating a website in which he wants to use different images as links to the web pages. He is also interested in adding some video clips to his website. Can you suggest to him the required tags to include the said elements in his website?
Ans: Rahim must use the following tags:
To insert images to his web page, use the <img> tag
• To create a link <a> tag.
• To insert video clips, use the <video> tag.
3. Ritika was writing an article using HTML. The article contains some external links to other websites containing additional information. How can she link these together so that the user can visit the destination of the external links by clicking on them?
Ans: To link to the external links, Ritika must use the following tag and syntax:
The tag to be used is the <a> tag
Syntax:
<a href = “destination file name”>link </a>.
4. Priyanka wants to create a form, but she has forgotten the tag used to create the form. Can you help her with the solution?
Ans: To create the form, Priyanka has to use the <form> tag.
IV. ANSWER THE FOLLOWING:
1. Why do you include hyperlinks on your web page? Give any two reasons.
Ans: Here are two primary reasons for including hyperlinks:
Resource Reference: We can connect documents to other resources or documents using hyperlinks.
Resource Reference: A hyperlink redirects the user to a particular section or component inside the same page or document.
2. Distinguish between the internal and external links.
Ans.
| Internal Linking | External Linking |
| Pages within the same website | Pages on different websites |
| Improve website navigation, discover related content, and distribute SEO authority | Provide additional resources, strengthen credibility, and potentially improve SEO |
| Increased user engagement, improved SEO, and a stronger overall website structure | Increased user engagement, improved SEO, and a stronger overall website structure |
3. What are frames? How are they useful?
Ans: In the context of HTML, frames refer to sections of a webpage that can display independent content within the same browser window.
Frames were considered useful for a few reasons:
- Division of Content: Frames enable the creation of a webpage layout with multiple sections, each displaying different content.
- Reusable Code: Frames allow the reuse of the same content (such as a navigation menu) across multiple pages without duplicating the HTML code.
4. What are two types of text input in HTML web forms?
Ans: In HTML web forms, two common types of text input are:
● Text Input Controls.
● Password Input Controls.
5. Which input control is most useful for questions requiring a simple Yes or No answer?
Ans: Radio Box Controls.
6. What is the use of password control in HTML forms?
Ans: Password controls in HTML forms hide what you type (like asterisks) to keep your secrets safe from inspecting eyes! They also encourage you to use stronger passwords for extra security.
7. What is the use of the <INPUT> tag?
Ans: The <input> tag in HTML is used to create an input field within a form. It allows users to enter and submit data to your website.
8. What are the uses of the Submit and Reset buttons?
Ans: The submit button is used to send the information you entered in a form to a website.
The reset button clears everything you entered in a form, bringing it back to its starting point.
2 thoughts on “Class 10 Computer Science Chapter 2 Question Answer”