Comprehensive HTML Interview Quiz Questions and Answers

January 23, 2023

Intro

This list of HTML interview questions and answers is a comprehensive guide to test your knowledge and prepare for your next interview. It covers the most important topics and concepts you need to know to become a front-end developer.

Try to answer the questions yourself before reading the answers. If you don't know all of them, don't worry. I didn't when I started making this list! 😅

For the ones you get wrong, try to find the answer online and play around with it in a code editor. Then come back to the list in a few days/weeks and try again. You'll be surprised how much you'll learn!

Interview Quiz Questions and Answers

Overview Questions

What does HTML stand for?

HTML is the standard markup language for creating...

What organization makes the Web standards?

What two things do you need to create a webpages and view them?

When was HTML5 released?

Terminology Questions

What is the difference between HTML elements and tags?

What is called an element that does not have a closing tag?

What is the difference between an empty element and a void element?

What is a HTML element attribute?

onblur and onfocus are

Syntax Questions

Which doctype is used for HTML5?

Where does the doctype go?

Which element defines the title of a document? Which element must be the parent of this element?

Where is the text of the title element displayed?

What are the main uses of meta tags?

What are HTML entities used for?

One common HTML entity is the ampersand. What does it look like?

Which character is used to indicate an end tag?

What do HTML comments look like?

Semantic HTML Questions

What is semantic HTML?

What are some examples of semantic HTML tags related to page structure?

What are some examples of semantic HTML tags related to text?

What are some examples of semantic HTML tags related to images?

What is the correct HTML element for important/bold text?

What is the correct HTML element for emphasized/italic text?

header and footer can be either the header/footer for...

<nav> is used to represent...

<aside> is used to represent...

<section> is used to represent...

<article> is used to represent...

What is the difference between section and article?

Table Questions

What are the elements used in tables?

What attribute of the td tag is used to merge table cells together?

Is it possible to have a table within a table?

Form Questions

Why do we have forms in HTML?

What are the new form input types in HTML5?

What input type do you use if you want to submit it but not show it?

What do you add to a button to make it submit the form?

What is the standard HTML for a dropdown list?

Which attribute specifies the input must be filled out?

What is the input type image used for?

What does the datalist tag do?

Image Questions

Which attribute specifies an alternate text for an image?

What is the canvas element used for?

What is the figure element? What element is used in tandem?

Difference Questions

Inline elements vs block elements

a vs link?

ul vs ol?

input with type text vs password?

input with type text vs textarea?

meter vs slider?

meter vs progress?

Miscellaneous Questions

What are the different levels of headings in HTML? Which one is the biggest?

What is the font-size of the h1 tag?

What attribute is used to add a link to any element?

What element is used to specify a section of text that is quoted from another source?

What element is used to add a line break?

What are the list types in HTML?

Which element is used to display a web page within a web page?

Which element is used for playing video files?

Which element is used for playing audio/sound files?

What is the ruby element? What spoken language uses this often?

What does the global attribute contenteditable do?

Which element is used to strikethrough text?

Mini Code Challenges

Create a link where the text is "Google" and on click, it opens a new tab to Google's homepage

Write "H2O" where the "2" is a subscript

Show the image of "https://placekitten.com/200/300" where the fallback text is "A cute kitten"

Create a table with a header, 3 columns, caption, 2 rows, a footer, and a merged cell. Style the first two columns with a background color. Have the second row be one cell.

Create a picture that changes sources by supported formats.

Create a picture that changes sources by screen density.