HTML Interview Questions with Answers
# HTML Interview Questions with Answers for Beginners and Intermediate Levels
## Beginner Level Questions
### 1. What is HTML?
HTML (HyperText Markup Language) is the standard language used to create web pages. It
provides the structure of a webpage using elements represented by tags.
### 2. What are HTML tags?
HTML tags are used to define elements in an HTML document. They are enclosed in angle
brackets, e.g., <p> for paragraphs. Tags often come in pairs: an opening tag <p> and a closing tag
</p>.
### 3. What is the difference between HTML and XHTML?
- HTML is more flexible and forgiving with syntax errors.
- XHTML is a stricter version of HTML, requiring proper nesting, case sensitivity, and closing of tags.
### 4. What is the purpose of the <!DOCTYPE> declaration?
The <!DOCTYPE> declaration specifies the version of HTML used in the document. It helps the
browser render the webpage correctly.
### 5. What are void elements in HTML?
Void elements are HTML elements that do not require a closing tag. Examples include <img>, <br>,
and <input>.
HTML Interview Questions with Answers
### 6. What is the difference between id and class attributes?
- id: Used to uniquely identify a single element. It must be unique within the document.
- class: Used to group multiple elements for styling or scripting.
### 7. What is the use of the <meta> tag?
The <meta> tag provides metadata about the HTML document, such as character encoding,
viewport settings, and SEO-related information.
### 8. How do you create a hyperlink in HTML?
Use the <a> tag. Example:
<a href="https://example.com">Visit Example</a>
### 9. What is the difference between inline, block, and inline-block elements?
- Inline: Does not start on a new line and takes up only as much width as necessary (e.g., <span>).
- Block: Starts on a new line and takes up the full width (e.g., <div>).
- Inline-block: Behaves like an inline element but allows block-level styling.
### 10. How do you include images in an HTML document?
Use the <img> tag with the src attribute. Example:
<img src="image.jpg" alt="Description">
## Intermediate Level Questions
### 11. What is the difference between <section>, <div>, and <article>?
- <section>: Represents a thematic grouping of content.
- <div>: A generic container with no semantic meaning.
HTML Interview Questions with Answers
- <article>: Represents self-contained, reusable content (e.g., blog posts).
### 12. Explain the <canvas> element.
The <canvas> element is used to draw graphics on a web page using JavaScript. Example usage
includes charts, games, and image manipulation.
### 13. What are semantic HTML elements? Provide examples.
Semantic HTML elements have meaningful names that indicate their purpose. Examples include
<header>, <footer>, <article>, and <nav>.
### 14. How do you create a table in HTML?
Use the <table> tag along with <tr> (table row), <th> (table header), and <td> (table data) tags.
Example:
<table>
<tr>
<th>Name</th>
<th>Age</th>
</tr>
<tr>
<td>John</td>
<td>25</td>
</tr>
</table>
### 15. What is the difference between <ul> and <ol>?
- <ul>: Creates an unordered list with bullet points.
HTML Interview Questions with Answers
- <ol>: Creates an ordered list with numbered items.
### 16. How do you make a webpage responsive?
Use the <meta> tag for viewport settings and CSS media queries to adjust the layout for different
screen sizes.
Example:
<meta name="viewport" content="width=device-width, initial-scale=1.0">
### 17. What are the new input types introduced in HTML5?
HTML5 introduced several new input types, including email, url, number, date, color, and range.
### 18. What is the purpose of the <iframe> tag?
The <iframe> tag is used to embed another HTML document within the current document. Example:
<iframe src="https://example.com" width="600" height="400"></iframe>
### 19. What are the advantages of using semantic HTML?
- Improved accessibility for screen readers.
- Better SEO as search engines understand content structure.
- Easier maintenance and readability.
### 20. How do you use the <video> and <audio> tags?
- Video Example:
<video controls>
<source src="video.mp4" type="video/mp4">
Your browser does not support the video tag.
</video>
HTML Interview Questions with Answers
- Audio Example:
<audio controls>
<source src="audio.mp3" type="audio/mpeg">
Your browser does not support the audio tag.
</audio>