Top 50 HTML Interview Questions and Answers

Top 50 HTML Interview Questions and Answers


1. What is HTML?

Answer: HTML (HyperText Markup Language) is the standard language used to create and structure web pages and applications.


2. What are HTML tags?

Answer: Tags are predefined keywords enclosed within angle brackets < > that define elements in HTML.

3. What is the difference between HTML and HTML5?

Answer: HTML5 introduces new semantic elements, multimedia tags like <video> and <audio>, and APIs like geolocation, local storage, and canvas.


4. What are semantic elements in HTML?

Answer: Semantic elements like <article>, <section>, <nav>, <header> clearly describe their meaning to both browser and developer.


5. What is the structure of a basic HTML document?

Answer:

<!DOCTYPE html> <html> <head> <title>Page Title</title> </head> <body> <h1>Hello World</h1> </body> </html>

6. What is the purpose of the <!DOCTYPE html>?

Answer: It tells the browser to use the HTML5 standard to render the page.

7. What are block-level vs inline elements?

Answer: Block-level elements take full width and start on a new line (e.g., <div>), while inline elements fit within content (e.g., <span>).


8. Difference between <div> and <span>?

Answer: <div> is a block-level container; <span> is an inline container for styling small parts of text.


9. What is the <head> tag used for?

Answer: Contains metadata like title, charset, and links to scripts and styles.


10. What does the <meta> tag do?

Answer: Defines metadata such as character set, page description, and keywords.


11. What is the use of the <title> tag?

Answer: Displays the title of the page in the browser tab.


12. What are void (empty) elements in HTML?

Answer: Tags that don’t have closing tags, like <br>, <img>, <hr>.


13. What is the difference between <strong> and <b>?

Answer: <strong> is semantic (important content); <b> just makes text bold.


14. What is the alt attribute in <img>?

Answer: Provides alternate text for images if they can’t be displayed.


15. What is the difference between <em> and <i>?

Answer: <em> adds emphasis (semantic), while <i> italicizes text (visual only).


16. What are global attributes in HTML?

Answer: Attributes like id, class, style, title that can be used on any HTML element.


17. What is the ‘href’ attribute in <a>?

Answer: Specifies the URL the link points to.


18. What does the target=”_blank” attribute do?

Answer: Opens the link in a new tab/window.


19. How do you add comments in HTML?

Answer:

<!-- This is a comment -->

20. What is the difference between ‘id’ and ‘class’?

Answer: id is unique and used once per page, class can be reused across multiple elements.


21. What is the purpose of the <form> tag?

Answer: Used to collect user input.


22. What are different input types in HTML?

Answer: text, password, radio, checkbox, submit, email, number, file, date, etc.


23. What is the difference between ‘readonly’ and ‘disabled’?

Answer: readonly allows viewing but not editing; disabled disables interaction entirely.


24. What is a placeholder in input fields?

Answer: A temporary hint shown in the input box.


25. How do you create radio buttons in HTML?

Answer:

<input type="radio" name="gender" value="male"> Male <input type="radio" name="gender" value="female"> Female

26. What is the use of <label> tag?

Answer: Improves accessibility by associating text with input fields.


27. What are semantic HTML5 tags?

Answer: Tags like <article>, <footer>, <nav>, <section> that describe their role clearly.


28. What is the <canvas> tag used for?

Answer: Used to draw graphics on the web via scripting (usually JavaScript).


29. What is the <audio> tag?

Answer: Embeds sound content in a web page.


30. What is the <video> tag?

Answer: Embeds video content.


31. How do you embed a YouTube video in HTML?

Answer:

<iframe width="560" height="315" src="https://www.youtube.com/embed/VIDEO_ID"></iframe>

32. What is localStorage in HTML5?

Answer: Stores data in the browser with no expiration.


33. What are data- attributes?*

Answer: Custom data attributes to store extra data on HTML elements.


34. What is the difference between GET and POST methods in a form?

Answer: GET appends data to the URL, POST sends data in the body of the request.


35. How do you create a dropdown list in HTML?

Answer:

<select> <option>Option 1</option> </select>

36. How do you create a checkbox in HTML?

Answer:

<input type="checkbox" name="vehicle" value="Bike"> Bike

37. What is a table in HTML?

Answer: An element that allows organizing data in rows and columns using <table>, <tr>, <td>.


38. What are colspan and rowspan in tables?

Answer: Span a cell across multiple columns or rows.


39. What is a nested list in HTML?

Answer: A list within a list:

<ul> <li>Item 1 <ul><li>Sub-item</li></ul> </li> </ul>

40. What is the difference between inline and internal CSS in HTML?

Answer: Inline is written in the tag itself; internal is placed within a <style> tag in the head.


41. What is responsive design?

Answer: Design that adjusts layout for various screen sizes.


42. How do you link an external CSS file?

Answer:

<link rel="stylesheet" href="style.css">

43. What are deprecated tags?

Answer: Tags no longer supported in HTML5 like <font>, <center>, etc.


44. How is HTML different from XML?

Answer: HTML is for displaying content, XML is for carrying data. HTML is less strict.


45. What is the use of the <iframe> tag?

Answer: Embeds another HTML page within the current page.


46. What is the role of accessibility in HTML?

Answer: Ensures web content is usable by people with disabilities using semantic tags and ARIA.


47. What is the <noscript> tag?

Answer: Displays content when JavaScript is disabled in the browser.


48. What is the role of the charset meta tag?

Answer:

<meta charset="UTF-8">

Defines the character encoding for the document.


49. What is the difference between innerText and innerHTML?

Answer: innerText returns plain text, innerHTML returns HTML content.


50. Can HTML be used without CSS or JavaScript?

Answer: Yes. HTML is used to structure content, but styling and interaction are limited without CSS/JS.

Related Posts

Top 10 PHP Interview Questions and Answers

Here are the Top 10 PHP Interview Questions and Answers (with brief answers) to help candidates prepare effectively: 1. What is PHP and what are its key features? Answer:PHP (Hypertext…

Top 50 PHP Interview Questions and Answers to Ace Your Next Job Interview

Top 50 PHP Interview Questions and Answers to Ace Your Next Job Interview! PHP is one of the most popular programming languages for web development. If you’re preparing for a…

Leave a Reply

Your email address will not be published. Required fields are marked *

You Missed

Top 50 HTML Interview Questions and Answers

Top 50 HTML Interview Questions and Answers

Fruit Memory Match Game – Boost Brainpower with Fun!

Fruit Memory Match Game – Boost Brainpower with Fun!

Cat Loader A Cute and Creative Loading Animation for Your Website

Cat Loader A Cute and Creative Loading Animation for Your Website

PHP is now the best choice for web based software

PHP is now the best choice for web based software
Top 10 PHP Interview Questions and Answers

Ghibli Style Image Generator

Ghibli Style Image Generator