Scribd
Upload
12 views5 pages

HTML interview questions

The document provides a comprehensive overview of HTML, covering basic, intermediate, and advanced questions about its structure, elements, and functionalities. Key topics include the evolution of HTML versions, differences between tags and attributes, semantic HTML, and various input types. It also discusses concepts like positioning in CSS, mobile responsiveness, and storage options in web development.

Uploaded by

Vaishnavi Kharbal
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
12 views5 pages

HTML interview questions

The document provides a comprehensive overview of HTML, covering basic, intermediate, and advanced questions about its structure, elements, and functionalities. Key topics include the evolution of HTML versions, differences between tags and attributes, semantic HTML, and various input types. It also discusses concepts like positioning in CSS, mobile responsiveness, and storage options in web development.

Uploaded by

Vaishnavi Kharbal
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
You are on page 1/ 5

https://docs.google.com/document/d/1tZjpuDJ8AYqS4p87nVgZOHekwPTrmzL9LBFjdWGOkbA/edit?tab=t.

Basic HTML Questions

1. What is HTML?

Answer: HTML (HyperText Markup Language) is the standard language for creating web pages. It uses a series of
elements (tags) to structure content on a webpage.

2. What are the different versions of HTML?

Answer:

 HTML 1.0 (1993) – The first version

 HTML 2.0 (1995) – Added form support

 HTML 3.2 (1997) – Improved tables and scripting

 HTML 4.01 (1999) – Introduced CSS and accessibility

 XHTML (2000) – Stricter version of HTML

 HTML5 (2014) – Added multimedia, semantics, and new APIs

3. What is the difference between HTML and HTML5?

Answer:

 HTML5 introduces semantic tags like <article>, <section>, <nav>, etc.

 HTML5 supports multimedia elements like <audio> and <video>.

 HTML5 provides local storage (Web Storage API) instead of cookies.

 HTML5 allows native form validation without JavaScript.

4. What are tags and attributes in HTML?

Answer:

 Tags define elements, e.g., <p> for paragraphs, <img> for images.

 Attributes provide additional information, e.g., <img src="image.jpg" alt="Image">, where src and alt are
attributes.

5. What is the difference between block-level and inline elements?

Answer:

 Block-level elements (<div>, <p>, <h1>) start on a new line and take full width.

 Inline elements (<span>, <a>, <strong>) do not start on a new line and only take as much width as needed.

6. What is the purpose of the <DOCTYPE> declaration?

Answer: The <!DOCTYPE> declaration tells the browser which version of HTML to use. Example:

html

CopyEdit
<!DOCTYPE html>

<html>

<head>

<title>My Page</title>

</head>

<body>

<p>Hello World!</p>

</body>

</html>

For HTML5, <!DOCTYPE html> is used.

7. What is the difference between <div> and <span>?

Answer:

 <div> is a block-level container used for layout grouping.

 <span> is an inline container used for styling parts of a text.

8. What is semantic HTML? Give examples.

Answer: Semantic HTML uses meaningful tags to describe content. Examples:

 <header> for page headers

 <nav> for navigation menus

 <article> for independent content

 <footer> for page footers

9. What are self-closing tags? Give examples.

Answer: Self-closing (void) tags do not require a closing tag. Examples:

html

CopyEdit

<img src="image.jpg" alt="Image">

<input type="text" placeholder="Enter name">

<br>

<hr>

10. What are void elements in HTML?

Answer: Void elements are tags that do not have a closing tag, such as <img>, <br>, <input>, <hr>.

Intermediate HTML Questions

11. What is the difference between <strong> and <b>, <em> and <i>?
Answer:

 <strong> (semantic) makes text bold for importance, while <b> (non-semantic) just makes it bold.

 <em> (semantic) emphasizes text (italic), while <i> just makes it italic for style.

12. What is the difference between absolute, relative, and fixed positioning in CSS?

Answer:

 Absolute: Positions relative to the nearest positioned ancestor or the <html> if none.

 Relative: Positions relative to its normal position.

 Fixed: Stays fixed relative to the viewport.

13. What are HTML entities? Give examples.

Answer: HTML entities are special codes for reserved characters:

html

CopyEdit

&lt; <!-- Less than (<) -->

&gt; <!-- Greater than (>) -->

&amp; <!-- Ampersand (&) -->

&quot; <!-- Double quote (") -->

&apos; <!-- Single quote (') -->

14. What is the difference between <ol> and <ul>?

Answer:

 <ol> (ordered list) uses numbers:

html

CopyEdit

<ol>

<li>Item 1</li>

<li>Item 2</li>

</ol>

 <ul> (unordered list) uses bullets:

html

CopyEdit

<ul>

<li>Item A</li>

<li>Item B</li>

</ul>
15. What is the difference between <section>, <article>, and <div>?

Answer:

 <section>: Groups related content.

 <article>: Represents standalone content (like blog posts).

 <div>: A generic container with no semantic meaning.

16. How do you make an HTML page mobile-responsive?

Answer:

 Use the viewport meta tag:

html

CopyEdit

<meta name="viewport" content="width=device-width, initial-scale=1">

 Use responsive CSS (@media queries).

17. What is the <meta> tag used for in HTML?

Answer: It provides metadata such as character set, viewport settings, SEO keywords, and author info.

18. What is the purpose of the <iframe> tag?

Answer: It embeds another webpage within a page:

html

CopyEdit

<iframe src="https://www.example.com" width="600" height="400"></iframe>

19. What is the difference between id and class attributes?

Answer:

 id is unique per element (#id in CSS).

 class can be shared by multiple elements (.class in CSS).

20. How do you add a favicon to a website?

Answer:

html

CopyEdit

<link rel="icon" type="image/png" href="favicon.png">

Advanced HTML Questions

21. What is the difference between <input type="submit"> and <button type="submit">?

Answer: <button> allows custom HTML inside, whereas <input> is limited to text.

22. What is lazy loading in HTML?


Answer: It delays loading images until needed:

html

CopyEdit

<img src="image.jpg" loading="lazy" alt="Lazy Loaded Image">

23. What are the different types of form input elements?

Answer: Text (text), Password (password), Email (email), Checkbox (checkbox), Radio (radio), File (file), Submit (submit).

24. What is the difference between local storage, session storage, and cookies?

Answer:

 Local Storage: Stores data permanently in the browser.

 Session Storage: Data lasts until the session ends.

 Cookies: Small data stored and sent with requests.

25. What are custom data attributes in HTML? How are they used?

Answer: Custom attributes (data-*) store extra info:

html

CopyEdit

<div data-user-id="123">User Name</div>

Access with JavaScript:

js

CopyEdit

let userId = document.querySelector("div").dataset.userId;

console.log(userId);

You might also like