ReactJS Interview Prep - HTML Fundamentals (Part 2)

Question 1

What is the purpose of the `<picture>` element?

Accepted Answer

Correct Answer

Answer

To natively apply CSS filters (like grayscale or blur) to an image.

Answer

To allow developers to specify multiple `<source>` elements for an image, enabling responsive images based on screen size or image format support.

Answer

To create a semantic container for an `` and its `

`.

Answer

To embed SVG graphics directly into the HTML.

Question 2

Which element is semantically correct for grouping an image with its caption?

Accepted Answer

Correct Answer

Answer

A `<picture>` wrapped around an `<img>` and a `<label>`.

Answer

A `<figure>` element containing an `<img>` and a `<figcaption>`.

Answer

A `

` with `class="image-wrapper"`.

Answer

An `<img>` element with a `title` attribute.

Question 3

What does the `sandbox` attribute do when applied to an `<iframe>`?

Accepted Answer

Correct Answer

Answer

It forces the iframe to load synchronously with the main document.

Answer

It caches the iframe content locally for offline viewing.

Answer

It enables a set of extra security restrictions for the content within the iframe, such as preventing script execution or form submission.

Answer

It allows the iframe to bypass the Same-Origin Policy entirely.

Question 4

Which HTML5 input type provides a native date picker widget in modern browsers?

Accepted Answer

Correct Answer

Answer

`type="calendar"`

Answer

`type="datetime"`

Answer

`type="date"`

Answer

`type="time-select"`

Question 5

How do you define a table header, body, and footer in HTML?

Accepted Answer

Correct Answer

Answer

Using `

`, `

`, and `

Answer

Using ``, ``, and `` respectively.

Answer

Using ``, ``, and ``.

Answer

Using ``, ``, and ``.

Question 6

What is the purpose of the `colspan` attribute in a table cell (`` or ``)?

Accepted Answer

Correct Answer

Answer

To define the specific width of the column in pixels.

Answer

To instruct the cell to span across multiple columns.

Answer

To group multiple rows together visually.

Answer

To hide a specific column from view.

Question 7

What is the function of the `autocomplete` attribute on an `<input>` field?

Accepted Answer

Correct Answer

Answer

It automatically submits the form when the user finishes typing.

Answer

It runs an spell-checker on the user's input.

Answer

It hints to the browser whether it should offer to automatically complete the input based on the user's previously stored data (like email or password).

Answer

It triggers an AJAX request to fetch search suggestions.

Question 8

Which tag is used to create a drop-down list of predefined options for an `<input>` text field?

Accepted Answer

Correct Answer

Answer

`<select>`

Answer

`<datalist>`

Answer

`<dropdown>`

Answer

`<menu>`

Question 9

What does the `<time>` element represent?

Accepted Answer

Correct Answer

Answer

A real-time clock widget displayed on the page.

Answer

A timer for a JavaScript execution loop.

Answer

A specific period in time, offering a machine-readable format via the `datetime` attribute.

Answer

An automated timestamp for when the HTML file was last modified.

Question 10

What is the purpose of the `preload` attribute in a `

Accepted Answer

Correct Answer

Answer

It forces the media to play automatically as soon as the page loads.

Answer

It provides a hint to the browser about how much of the media file it should download before the user presses play.

Answer

It completely blocks the page from rendering until the media is fully downloaded.

Answer

It caches the media permanently in LocalStorage.

Question 11

How do you make an image responsive so it scales with its container, but never grows larger than its original size?

Accepted Answer

Correct Answer

Answer

Set `width="100%"` and `height="auto"` in HTML.

Answer

Wrap the image in a responsive `<picture>` tag.

Answer

It requires CSS: `max-width: 100%; height: auto;`.

Answer

Use the HTML5 `responsive="true"` attribute.

Question 12

What is the function of the `accept` attribute on an `<input type="file">`?

Accepted Answer

Correct Answer

Answer

It automatically scans uploaded files for viruses.

Answer

It forces the user to agree to Terms and Conditions before uploading.

Answer

It specifies the types of files (e.g., `.jpg, .png, image/*`) that the server accepts, filtering the OS file picker dialog.

Answer

It sets a strict file size limit for uploads.

Question 13

What is the semantic purpose of the `<mark>` tag?

Accepted Answer

Correct Answer

Answer

To create a strict division between paragraphs.

Answer

To indicate text that has been deleted from a document.

Answer

To highlight or mark text for reference or notation purposes, due to its relevance in another context.

Answer

To style text exactly like a `<strong>` tag.

Question 14

Which tag is used to display text exactly as it is typed, preserving all spaces and line breaks?

Accepted Answer

Correct Answer

Answer

`<code>`

Answer

`<samp>`

Answer

`<pre>`

Answer

`<verbatim>`

Question 15

What does the `<base>` element do?

Accepted Answer

Correct Answer

Answer

It specifies a base URL and/or default target for all relative URLs in a document.

Answer

It defines the root directory for the server.

Answer

It sets the primary language for the document.

Answer

It forces the browser to use a specific base font size.

Question 16

How do you specify a description list (a list of terms and their corresponding descriptions) in HTML?

Accepted Answer

Correct Answer

Answer

Using `<ul type="description">`.

Answer

Using `

` for the term, and `: ` for the description.

Answer

Using `` with `` and `` elements.

Answer

Description lists do not exist in HTML; you must use a `<table>`.

Question 17

What is the `pattern` attribute used for on an `<input>` element?

Accepted Answer

Correct Answer

Answer

To apply a decorative background pattern to the input field.

Answer

To specify a Regular Expression that the input's value is validated against upon form submission.

Answer

To define the layout structure of the input within a CSS Grid.

Answer

To automatically format telephone numbers as the user types.

Question 18

What is the meaning of the `contenteditable` attribute?

Accepted Answer

Correct Answer

Answer

It encrypts the content, preventing users from copying it.

Answer

It allows the user to directly click and edit the content of an HTML element as if it were a text area.

Answer

It indicates that the content is dynamically generated by a server-side CMS.

Answer

It is a boolean flag used by React to determine state updates.

Question 19

Which element represents the result of a calculation or user action?

Accepted Answer

Correct Answer

Answer

`<result>`

Answer

`<output>`

Answer

`<calc>`

Answer

`<span>`

Question 20

What is the purpose of the `multiple` attribute on an `` or `

Accepted Answer

Correct Answer

Answer

It duplicates the input field visually on the screen.

Answer

It allows the user to enter multiple values (e.g., comma-separated emails) or select more than one option from a list/file picker.

Answer

It submits the form multiple times to different server endpoints.

Answer

It automatically multiplies numeric inputs by a defined factor.

Question 21

How does the `<address>` element function semantically?

Accepted Answer

Correct Answer

Answer

It strictly formats text to follow US Postal Service standards.

Answer

It triggers the browser to open a map application when clicked.

Answer

It provides contact information for its nearest `

` or `` ancestor.

Answer

It is a deprecated tag replaced by `

`.

Question 22

What is the purpose of the `<kbd>` tag?

Accepted Answer

Correct Answer

Answer

To define keyboard shortcuts that trigger JavaScript functions.

Answer

To represent inline text denoting user input from a keyboard, voice input, or any other text entry device.

Answer

To disable keyboard navigation for a specific element.

Answer

To display a virtual keyboard on mobile devices.

Question 23

What does the `spellcheck` attribute do?

Accepted Answer

Correct Answer

Answer

It automatically corrects misspelled words without user confirmation.

Answer

It forces the browser to check the grammar of the entire document.

Answer

It is an enumerated attribute (true/false) that indicates whether the element's text may be checked for spelling errors by the browser.

Answer

It connects the input to a third-party dictionary API.

Question 24

What is the primary use of the `<iframe>` `srcdoc` attribute?

Accepted Answer

Correct Answer

Answer

To link to a secure, encrypted document URL.

Answer

To specify inline HTML content to be rendered inside the iframe, overriding the `src` attribute if both are present.

Answer

To define the source code documentation for an open-source project.

Answer

To download the iframe content as a `.doc` file.

Question 25

Which tag is used to semantically embed a self-contained SVG (Scalable Vector Graphic) directly into HTML?

Accepted Answer

Correct Answer

Answer

`<vector>`

Answer

`<graphic>`

Answer

`<svg>`

Answer

`<canvas>`

Academy

ReactJS Interview Prep - HTML Fundamentals (Part 2)