Class 10 HTML Questions and Answers
Basic HTML Questions
1. What is the purpose of the <title> tag in an HTML document?
The <title> tag is used to define the title of the HTML document. This title appears on the browser's title bar or tab and is essential for usability and accessibility. It helps users identify the content of the page and is also used by search engines to determine the relevance of the page to a search query. A well-crafted title can improve search engine optimization (SEO) and make the page more user-friendly.
2. How do you create a hyperlink in HTML?
To create a hyperlink in HTML, use the <a> (anchor) tag. The href attribute specifies the URL of the page the link goes to. For example:
<a href="https://www.example.com">Visit Example</a>
This code creates a clickable link with the text "Visit Example," which will take the user to the specified URL when clicked. Hyperlinks can be used to link to other web pages, resources, or even different sections within the same page.
3. What is the difference between the <div> and <span> elements?
The <div> and <span> elements are both used for grouping and styling HTML content, but they serve different purposes:
- <div>: The <div> element is a block-level container that is used to group larger sections of content. It starts on a new line and takes up the full width available. It is commonly used to create sections of a webpage and apply styles or layouts to larger blocks of content.
- <span>: The <span> element is an inline container used to group small parts of text or other inline elements. It does not start on a new line and only takes up as much width as necessary. It is often used for styling a specific portion of text or applying CSS classes to small parts of content.
4. How do you add an image to an HTML page?
To add an image to an HTML page, use the <img> tag. The src attribute specifies the path to the image file, and the alt attribute provides alternative text that describes the image. For example:
<img src="image.jpg" alt="Description of image">
The alt attribute is important for accessibility and SEO, as it helps screen readers describe the image to visually impaired users and provides context if the image fails to load.
5. What is the function of the <meta> tag in an HTML document?
The <meta> tag provides metadata about the HTML document. Metadata is information about the document that is not displayed on the page but is used by browsers and search engines. Common uses of the <meta> tag include:
<meta charset="UTF-8">: Specifies the character encoding for the document, ensuring that text is displayed correctly.<meta name="viewport" content="width=device-width, initial-scale=1.0">: Controls the layout on mobile browsers and ensures the page is responsive.<meta name="description" content="A brief description of the page">: Provides a brief description of the page's content, which can be used by search engines in search results.
HTML Forms
6. How do you create a simple HTML form with a text input and a submit button?
To create a basic HTML form, use the <form> tag with the action and method attributes to specify the URL where the form data will be sent and the HTTP method to be used. Inside the form, use the <label> tag to describe the form field and the <input> tag for user input. For example:
<form action="/submit" method="post">
<label for="name">Name:</label>
<input type="text" id="name" name="name">
<input type="submit" value="Submit">
</form>
This form includes a text input field for the user's name and a submit button to send the form data to the server.
7. How do you create a dropdown menu in an HTML form?
To create a dropdown menu, use the <select> element with nested <option> elements to define the available options. For example:
<label for="options">Choose an option:</label>
<select id="options" name="options">
<option value="option1">Option 1</option>
<option value="option2">Option 2</option>
</select>
This code creates a dropdown menu with two options for the user to choose from.
8. How do you create a radio button group in an HTML form?
To create a group of radio buttons, use the <input> element with the type set to "radio" and ensure that all radio buttons in the group have the same name attribute. For example:
<label>
<input type="radio" name="gender" value="male"> Male
</label>
<label>
<input type="radio" name="gender" value="female"> Female
</label>
In this example, both radio buttons are part of the "gender" group, allowing the user to select only one option.
9. How do you create a checkbox in an HTML form?
To create a checkbox, use the <input> element with the type set to "checkbox". For example:
<label>
<input type="checkbox" name="subscribe" value="newsletter"> Subscribe to newsletter
</label>
This creates a checkbox that allows users to opt in to a newsletter subscription.
10. What does the <input type="password"> do in an HTML form?
The <input type="password"> element creates a field where the input characters are obscured to protect sensitive information such as passwords. For example:
<label for="password">Password:</label>
<input type="password" id="password" name="password">
In this example, the characters entered into the password field will be displayed as dots or asterisks.
HTML Lists and Tables
11. How do you create an unordered list in HTML?
To create an unordered list, use the <ul> (unordered list) tag with nested <li> (list item) tags for each item in the list. For example:
<ul>
<li>Item 1</li>
<li>Item 2</li>
</ul>
This creates a bulleted list with two items.
12. How do you create an ordered list in HTML?
To create an ordered list, use the <ol> (ordered list) tag with nested <li> (list item) tags for each item. For example:
<ol>
<li>First item</li>
<li>Second item</li>
</ol>
This creates a numbered list with two items.
13. How do you create a table in HTML?
To create a table, use the <table> tag along with <tr> (table row), <th> (table header), and <td> (table data) tags. For example:
<table>
<tr>
<th>Header 1</th>
<th>Header 2</th>
</tr>
<tr>
<td>Data 1</td>
<td>Data 2</td>
</tr>
</table>
This creates a table with two columns and one row of data, plus a header row.
14. How do you add a caption to an HTML table?
To add a caption to a table, use the <caption> tag within the <table> element. For example:
<table>
<caption>Table Caption</caption>
<tr>
<th>Header 1</th>
<th>Header 2</th>
</tr>
<tr>
<td>Data 1</td>
<td>Data 2</td>
</tr>
</table>
This adds a caption titled "Table Caption" above the table, which helps describe its content.
15. How do you merge cells in an HTML table?
To merge cells, use the colspan attribute to merge columns or the rowspan attribute to merge rows. For example:
<table>
<tr>
<td colspan="2">Merged Cell</td>
</tr>
</table>
This merges two columns into a single cell within the table.
HTML Multimedia
16. How do you embed a video in an HTML page?
To embed a video, use the <video> tag with the controls attribute to provide playback controls. The src attribute specifies the path to the video file. For example:
<video width="320" height="240" controls>
<source src="movie.mp4" type="video/mp4">
Your browser does not support the video tag.
</video>
This embeds a video player with controls for playing, pausing, and adjusting the volume. The source element allows you to specify multiple video formats for better compatibility.
17. How do you embed audio in an HTML page?
To embed audio, use the <audio> tag with the controls attribute. The src attribute specifies the path to the audio file. For example:
<audio controls>
<source src="audio.mp3" type="audio/mpeg">
Your browser does not support the audio element.
</audio>
This creates an audio player with controls for playing, pausing, and adjusting the volume. Multiple source elements can be used for different audio formats.
18. What is the use of the <iframe> tag in HTML?
The <iframe> tag is used to embed another HTML document within the current document. This can be used to embed external content like maps, videos, or other webpages. For example:
<iframe src="https://www.example.com" width="600" height="400"></iframe>
This creates an inline frame that displays the content of "https://www.example.com" within the webpage. The width and height attributes control the size of the iframe.
19. How do you create an HTML5 video element with multiple sources?
To ensure compatibility across different browsers, you can specify multiple video formats within the <video> tag using multiple <source> elements. For example:
<video width="320" height="240" controls>
<source src="movie.mp4" type="video/mp4">
<source src="movie.ogg" type="video/ogg">
Your browser does not support the video tag.
</video>
This code provides two formats of the video, improving compatibility with various browsers that may support different formats.
20. How do you add a subtitle track to an HTML5 video?
To add subtitles, use the <track> tag within the <video> element. For example:
<video width="320" height="240" controls>
<source src="movie.mp4" type="video/mp4">
<track src="subtitles_en.vtt" kind="subtitles" srclang="en" label="English">
Your browser does not support the video tag.
</video>
The src attribute of the <track> tag specifies the path to the subtitle file in WebVTT format, while kind defines the type of track (e.g., subtitles, captions), srclang specifies the language, and label provides a name for the track.
.png)
0 Comments