Top 40+ HTML Interview Questions and Answers (2025)

Below is a compilation of commonly asked questions during HTML interviews, including HTML5-specific queries, along with their corresponding answers.

1) What is HTML?

Hyper Text Markup Language, commonly known as HTML, serves as the foundation language for the World Wide Web. This standardized text formatting language is essential for the creation and presentation of web pages. By leveraging HTML, users can enhance the interactivity and dynamism of text, transforming it into various elements such as images, tables, and links.

2) What are Tags?

In HTML, tags consist of three components: an opening tag, content, and a closing tag. Certain tags do not require a closing tag and are referred to as self-closing tags.

Within HTML files, there are two essential components to be aware of:

• ✅ The content itself
• ✅ The tags that structure and format the content.

As a web browser processes an HTML document, it scans through it in a top-down and left-to-right manner. HTML tags play a crucial role in forming HTML documents and defining their characteristics, with each tag having its unique set of attributes.

Syntax

<tag> content </tag>

Data is shown on a webpage by enclosing content within tags.

3) Do all HTML tags have an end tag?

No, certain HTML tags do not require a corresponding closing tag. For instance, the <image> tag and the <br> tag are examples of self-closing tags in HTML.

4) What is formatting in HTML?

HTML formatting involves styling text to enhance its appearance. This is achieved by applying various tags to modify the text, such as making it bold, italicized, or underlined.

5) How many types of heading does an HTML contain?

The HTML contains six types of headings which are defined with the <h1> to <h6> tags. Each type of heading tag displays different text size from another. So, <h1> is the largest heading tag and <h6> is the smallest one. For example:

<h1>Heading no. 1</h1>  

<h2>Heading no. 2</h2>  

<h3>Heading no. 3</h3>  

<h4>Heading no. 4</h4>  

<h5>Heading no. 5</h5>  

<h6>Heading no. 6</h6>

6) How to create a hyperlink in HTML?

The HTML provides an anchor tag to create a hyperlink that links one page to another page. These tags can appear in any of the following ways:

• ✅ Unvisited link - It is displayed, underlined and blue.
• ✅ Visited link - It is displayed, underlined and purple.
• ✅ Active link - It is displayed, underlined and red.

7) Which HTML tag is used to display the data in the tabular form?

The HTML table element is employed for presenting data in a structured format with rows and columns. It is also responsible for organizing the webpage layout, such as the header, navigation menu, main content, and footer. Below are the tags utilized for showcasing data in a tabular layout:

8) What are some common lists that are used when designing a page?

There are many common lists which are used to design a page. You can choose any or a combination of the following list types:

• ✅ Ordered list - The ordered list displays elements in numbered format. It is represented by <ol> tag.
• ✅ Unordered list - The unordered list displays elements in bulleted format. It is represented by <ul> tag.
• ✅ Definition list - The definition list displays elements in definition form like in dictionary. The <dl>, <dt> and <dd> tags are used to define description list.

9) What is the difference between HTML elements and tags?

HTML tags instruct the browser on how to display text content. These tags are created by enclosing elements within angle brackets <>. Typically, HTML tags are used in pairs to wrap around the content they affect.

10) What is semantic HTML?

Semantic HTML is a coding style. It is the use of HTML markup to reinforce the semantics or meaning of the content. For example: In semantic HTML <b> </b> tag is not used for bold statement as well as <i> </i> tag is used for italic. Instead of these we use <strong></strong> and <em></em> tags.

11) What is an image map?

An image map enables the linking of multiple web pages through a single image. This functionality is implemented using the <map> tag. By defining shapes within an image, specific areas can be designated for inclusion in the image map.

12) How to insert a copyright symbol on a browser page?

To include a copyright symbol in an HTML document, you can utilize either &copy; or &#169; entities.

13) How to create a nested webpage in HTML?

The HTML iframe element is utilized for showcasing a nested webpage, essentially embedding one webpage inside another. It defines an inline frame within an HTML document. For instance:

<!DOCTYPE html>  

<html>  

<body>  

<h2>HTML Iframes example</h2>  

<p>Use the height and width attributes to specify the size of the iframe:</p>  

<iframe src="https://placehold.co/400x300/1abc9c/ffffff?text=Sample+Image" height="300" width="400"></iframe>  

</body>  

</html>

14) How do you keep list elements straight in an HTML file?

Maintain the alignment of list items by utilizing proper indentation.

15) Does a hyperlink only apply to text?

Yes, hyperlinks can be applied to both text and images in HTML. The HTML anchor tag establishes a connection between different pages through a hyperlink. The "href" attribute plays a crucial role as it specifies the destination of the hyperlink within the HTML anchor tag.

Syntax

<a href = "..........."> Link Text </a>

16) What is a style sheet?

A stylesheet is essential for creating a uniform, portable, and aesthetically pleasing style framework that can be applied across multiple web pages. It defines the appearance and layout of a document written in a markup language.

17) Can you create a multi-colored text on a web page?

Certainly. In order to display text in multiple colors on a webpage, you have the option to apply CSS classes to the particular text elements you wish to colorize.

18) Is it possible to change the color of the bullet?

The bullet's color is determined by the color of the initial text in the list. Therefore, adjusting the bullet's color requires modifying the text color accordingly.

19) Explain the layout of HTML?

The HTML layout defines the structure of a webpage.

Each webpage is designed with a unique structure to present information in a particular format.

Following are different HTML5 elements which are used to define the different parts of a webpage.

• ✅ <header>: It is used to define a header for a document or a section.
• ✅ <nav>: It is used to define a container for navigation links
• ✅ <section>: It is used to define a section in a document
• ✅ <article>: It is used to define an independent, self-contained article
• ✅ <aside>: It is used to define content aside from the content (like a sidebar)
• ✅ <footer>: It is used to define a footer for a document or a section

20) What is a marquee?

The marquee element is utilized to display scrolling text on a webpage. It automatically scrolls the text or image in various directions such as up, down, left, or right. To enable scrolling, the desired text should be enclosed within the <marquee>......</marquee> tags.

21) How many tags can be used to separate a section of texts?

Three tags are used to separate the texts.

• ✅ <br> tag - Usually <br> tag is used to separate the line of text. It breaks the current line and conveys the flow to the next line
• ✅ <p> tag - The <p> tag contains the text in the form of a new paragraph.
• ✅ <blockquote> tag - It is used to define a large quoted section. If you have a large quotation, then put the entire text within <blockquote>.............</blockquote> tag.

22) How to make a picture of a background image of a web page?

To set an image as the background of a webpage, you need to insert the provided tag code following the </head> tag.

<body background = "image.gif">

Please substitute "image.gif" with the filename of the image you wish to showcase on your website.

23) What are empty elements?

Elements in HTML that do not contain any content are referred to as empty elements. Examples of empty elements include <br>, <hr>, and so forth.

24) What is the use of a span tag? Give one example.

The span tag is used for following things:

• ✅ For adding color on text
• ✅ For adding background on text
• ✅ Highlight any color text

Example:

<p>

<span style="color:#ffffff;">

In this page we use span.

</span>

</p>

25) What is the use of an iframe tag?

An iframe is employed to showcase a webpage inside another webpage.

Syntax:

<iframe src="https://placehold.co/400x300/1abc9c/ffffff?text=Sample+Image"></iframe>

Example:

<iframe src="https://placehold.co/400x300/3498db/ffffff?text=Sample+Image" width="200px" height="200px"></iframe>

Target to a link:

<iframe src="https://placehold.co/400x300/3498db/ffffff?text=Sample+Image" name="iframe_a"></iframe>

26) What are the entities in HTML?

HTML character entities serve as substitutes for reserved characters within HTML documents. They can also be utilized to replace characters that are not readily available on a standard keyboard. The reason for replacing these characters is due to certain characters being designated as reserved within the HTML language.

27) Why is a URL encoded in HTML?

Encoding a URL involves transforming non-ASCII characters into a suitable format for Internet transmission, as URLs are limited to the ASCII character-set when sent over the Internet. In cases where a URL includes characters beyond the ASCII range, it must undergo conversion. This process entails substituting non-ASCII characters with a "%" followed by hexadecimal digits.

28) Does a <!DOCTYPE html> tag is a HTML tag?

The <!DOCTYPE html> declaration is not classified as an HTML tag. Various versions of HTML exist such as HTML 4.01 Strict, HTML 4.01 Transitional, HTML 4.01 Frameset, XHTML 1.0 Strict, XHTML 1.0 Transitional, XHTML 1.0 Frameset, and XHTML 1.1. Consequently, <!DOCTYPE html> serves the purpose of informing the web browser about the HTML page.

Explore a compilation of prominent interview inquiries and responses pertaining to HTML5.

29) What is the canvas element in HTML5?

The <canvas> element serves as a container utilized for rendering graphics on a webpage through scripting languages such as JavaScript. It facilitates the dynamic creation and manipulation of 2D shapes and bitmap images. Canvas provides various functions for drawing paths, rectangles, circles, text, and incorporating images. For instance:

<canvas id="myCanvas1" width="300" height="100" style="border:2px solid;">  

Your browser does not support the HTML5 canvas tag.  

</canvas>

30) What is SVG?

HTML SVG is employed to define two-dimensional vector and vector/raster graphics. SVG images and their functionalities are specified in XML text documents. Just like XML files, you have the capability to generate and modify an SVG image using a text editing tool. This technology is predominantly utilized for creating vector-based diagrams such as pie charts and 2D graphs within an X, Y coordinate configuration.

<svg width="100" height="100">  

 <circle cx="50" cy="50" r="40" stroke="yellow" stroke-width="4" fill="red" />  

</svg>

31) What are the different new form element types in HTML 5?

Following is a list of 10 frequently used new elements in HTML 5:

• ✅ Color
• ✅ Date
• ✅ Datetime-local
• ✅ Email
• ✅ Time
• ✅ Range
• ✅ Telephone
• ✅ Number
• ✅ Search

32) Is there any need to change the web browsers to support HTML5?

Most modern web browsers, such as Chrome, Firefox, Opera, Safari, and Internet Explorer, are compatible with HTML 5. This widespread support ensures that HTML 5 features can be utilized across various browsing platforms.

33) Which type of video formats are supported by HTML5?

HTML 5 provides compatibility for three different video formats:

-

-

• ✅ WebM

34) Is audio tag supported in HTML 5?

Certainly. The audio tag in HTML 5 is utilized for embedding sound or music files within a web page. It supports three file formats for this purpose.

Below is the code snippet that demonstrates how to use the HTML audio tag to play an mp3 file:

<audio controls>
  <source src="audio_file.mp3" type="audio/mpeg">
  Your browser does not support the audio element.
</audio>

In this code:

• ✅ The <audio> tag is used to embed sound content in an HTML document.
• ✅ The controls attribute adds audio controls like play, pause, and volume.
• ✅ The <source> tag specifies multiple media resources for the browser to choose from.
• ✅ The src attribute in the <source> tag specifies the URL of the audio file.
• ✅ The type attribute in the <source> tag specifies the media type of the audio file.
• ✅ The text "Your browser does not support the audio element." will be displayed if the browser does not support the audio element.
Example
Copy
Try it Yourself

<audio controls>

<source src="https://placehold.co/400x300/1abc9c/ffffff?text=Sample+Image" type="audio/mpeg">

Your browser does not support the html audio tag.

</audio>

You have the flexibility to input a different file name for the MP3 file other than koyal.mp3.

### 35) What is the difference between progress and meter tag?

The progress element is utilized to indicate the advancement of a specific task, whereas the meter element serves the purpose of gauging data within a specified range. Additional information is provided below.

### 36) What is the use of figure tag in HTML 5?

The figure element is utilized to insert an image within a webpage document. It is employed to manage a collection of illustrations, images, code snippets, along with some integrated content.

<p>The Taj Mahal is widely recognized as "the jewel of Muslim art in India and one of the universally admired masterpieces of the world's heritage."</p>

<figure>

</figure>

### 37) What is the use of figcaption tag in HTML 5?

The <figcaption> element is used to provide a caption to an image. It is an optional tag and can appear before or after the content within the <figure> tag. The <figcaption> element is used with <figure> element and it can be placed as the first or last child of the <figure> element.

<figure>

<figcaption>Fig.1.1 - A front view of the great Taj Mahal in Agra.</figcaption>

</figure>

### 38) What is button tag?

The button element is an essential feature in HTML 5, primarily utilized to generate interactive buttons within web page forms. Typically, it serves the purpose of generating buttons for actions like submission or resetting. Below is an example code snippet to demonstrate the implementation of a button on a webpage.

### 39) What is the use of details and summary tag?

The <details> element is utilized to provide extra information on a webpage that can be shown or hidden as needed. It is typically used in conjunction with the <summary> element to provide a brief overview.

### 40) What is datalist tag?

The datalist tag in HTML 5 offers an autocomplete functionality for form elements, making it easier for users to select predefined options when entering data.

<label>

Enter your favorite cricket player: Press any character<br />

<datalist id="CktPlayers">

<option value="Sachin Tendulkar">

<option value="Brian Lara">

<option value="Jacques Kallis">

<option value="Ricky Ponting">

<option value="Rahul Dravid">

<option value="Shane Warne">

<option value="Rohit Sharma">

<option value="Donald Bradman">

<option value="Saurav Ganguly ">

<option value="AB diVilliers">

<option value="Mahendra Singh Dhoni">

<option value="Adam Gilchrist">

</datalist>

</label>

### 41) How are tags migrated from HTML4 to HTML5?

| No. | Typical HTML4 | Typical HTML5 |
| --- | --- | --- |
| 1) | `<div>` | <div> |
| 2) | `<div>` | <div> |
| 3) | `<div>` | <div> |
| 4) | `<div>` | <div> |
| 5) | `<div>` | <div> |

### Header and Footer Example

HTML 4 Header and Footer:

.

.

.

HTML 5 Header and Footer:

<header>

<h1>Monday Times</h1>

</header>

.

.

.

<footer>

<p>© C# Tutorial. All rights reserved.</p>

</footer>

### Menu Example

HTML 4 Menu:

HTML 5 Menu:

<nav>

• News
• Sports
• Weather

</nav>

### 42) If I do not put <!DOCTYPE html> will HTML 5 work?

No, the browser won't recognize it as an HTML document and the HTML 5 tags won't work correctly.

### 43) What is the use of the required attribute in HTML5?

It is a requirement for users to input text into a text field or text area prior to submitting a form, serving the purpose of form validation.

Example:

Name: <input type="text" name="name" required>

### 44) What are the new <input> types for form validation in HTML5?

The latest input varieties for form validation include email, URL, number, tel, and date.

Example: