Scribd
Upload
37 views

Hackr Io Blog HTML Interview Questions

Find programming course discounts and offers. View HTML interview questions and answers divided into beginner, intermediate, and advanced levels covering topics like HTML tags, image maps, lists, links, and style sheets. Examples provided include adding color to text, creating buttons and frames, and using SVG, canvas, and different heading tags.

Uploaded by

Qaim Deen
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
37 views

Hackr Io Blog HTML Interview Questions

Find programming course discounts and offers. View HTML interview questions and answers divided into beginner, intermediate, and advanced levels covering topics like HTML tags, image maps, lists, links, and style sheets. Examples provided include adding color to text, creating buttons and frames, and using SVG, canvas, and different heading tags.

Uploaded by

Qaim Deen
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 23

Need a discount on popular programming courses? Find them here.

View offers

$93,000/Year Login
Is
What
Home / Articles / HTML 5 / html‐interview‐questions
a
Dev
Vijay Singh Khatri | 14 Dec, 2022

Can
Earn
Join,
Become
a
Tech
Expert
&
Access:
•
Courses
•
Tutorials
&
cheat
sheets
•
Curated
job
offers
This video file cannot
be played.
Your email
(Error Code: 102630)

I want to learn Programming

ACCESS NOW

HTML is one part of the web development process. It is easy to learn,


and many tutorials are available online. However, the interview
experience can be quite different, 

Here, we have put down several of the most common HTML Interview
questions and answers, ones which you are likely to be asked during
interviews. We’ve divided these questions into beginner, intermediate
and advanced level HTML interview questions.

HTML stands for HyperText Markup Language. HTML is a standard text


formatting language that creates and displays a variety of pages on the
web.
HTML consists of two components: the first is the content, and the
second is the tag. Together, they help display pages with the required
information.

HTML tags help place content in a proper format. Tags are opened and
closed with < and > respectively. / is also used in the closing tag. For
example:

<head> 

</head>

No. The HTML tags are not always applied in pairs because some don’t
need a closing tag. For instance, for the <img> tag, the closing tags are
not required.
The standard list that is referred to while designing a page includes any
or combination of the following:

Menu list
Directory list
Ordered list
Unordered list
Definition list

In some cases, the browser running does not support the character, and
thus the character is displayed as boxes. 

An image map helps link different kinds of web pages using a single
image. The image map can be used for defining shapes in the images
that are made part of the image mapping process.

White space is the empty sequence of space characters. This white space
is considered a single space character in the HTML. White space helps
the browser collapse multiple spaces into one single space, and thereby
the indent lines of the text can be taken care of conveniently.

Yes, some attribute values can be set to predefined values, but other
attributes can accept any kind of numerical value, which represents the
pixel size.

We can create several links to different sections within the same web
page by using the <a> tag along and using the # symbol.

Yes, we can keep list elements straight in the HTML file by using indents.
The indent can also be used for the sub‐nested list for the parent list
that contains it for creating more lists and elements.

The top‐level page is the most popular web page that is printed and
pointed mostly as the web address in the magazine because it helps
users browse all other pages on the website from the same link.
Alternate text is used to apply descriptive text to each of the hotspot
links.

Of course, the HTML files could work on a new browser, but the new
browser must be compliant with the HTML standards. It may be possible
that new browsers do not support the features of HTML and therefore
won’t work well.

No, the hyperlink does not apply to the text‐only but also to the images.
This means that we can convert an image into a link that can allow the
users to gain access to another page when clicked on it.

Symbols can be represented in the form of an image instead.


The two attributes of the number type in the middle of a list include the
type and value. The type attribute is used to change the numbering type
for any list item, while the value attribute is used for changing the
number index for any list item.

A style sheet helps create a well‐defined template that is both consistent


and transportable. These style sheet templates can be linked to various
web pages, which makes it easier to maintain and change the look of
the web page.

The different list types of the ordered list include roman numerals and
alphabetical. On the other hand, the unordered list attributes can be set
through circle, square, or disc.

By using the <font color=“color”> tags for the text where the color
needs to be applied.

There are several advantages to grouping several checkboxes. These


include:

Organizing checkboxes.
Applying particular names on the checkbox buttons to differentiate
them easily from a group.
Supporting the creation of a different group of checkboxes on a
single webpage with different names.

An overlapping set of tags in the HTML results in the recognition of only


the first tag. Such issues occur only when the text does not display on
the browser screen.

The limit is 13 characters. The size attribute can be set to as low as 1.

Applets are small programs that are embedded with web pages so that
they can perform particular functions, including animation, information
processing, and even computation. Applets are written using the Java
language.

The specification of color for table borders can be made in the style
sheet, and in its absence, the same color as the text will apply.
Yes, the style sheet can apply tables to position text and images to align
them.

The color of bullets is usually the color of the first character in the list.
However, if you change the color of the first character with the set of
<font> tags, then the bullet color and first character color from the text
will change.

The maximum size value can be determined by the browser width.

If the size attribute is set to zero, then the size will be set to the default
size of 13 characters.

If the border attribute is set to a non‐zero value, then the default cell
borders with the thickness of one pixel will be added automatically.
Similarly, if the rule attribute is added to the <table> tag, then the
border attribute will not be included, and the default one‐pixel border
will be set and appear on the screen.

A Marquee helps set scrolling text on the web page. To apply a


marquee, you use the <marquee> tag.
By default, the text cannot appear outside the browser, but, in case the
text is part of a table cell with a predefined width, it could extend
beyond the browser window.

No, the style sheets do not limit the number of style definitions for a
given selector, which can be included within the brackets. However,
every new style definition needs to be separated from others using the
semicolon symbol.

Yes, there is a hierarchy that is followed on the style sheet, which


includes three different style definitions. The first definition, which is
closest to the actual tag, takes precedence. The second definition, which
is the inline style, takes priority over the embedded style sheet. The third
definition is the external style sheets, which take priority over the others.

Yes, we can group the various selectors with different class names and
the same style definition by using commas.
No, the external CSS file cannot be opened in the browser because the
file has a different extension. However, it can be opened only with
<link> tag within the HTML document.

No, the list‐style‐type property cannot affect the paragraph, and will
ignore this non‐list element.

A canvas element supports the creation of charts and graphs. It helps


create 2D images that can be placed directly through the HTML5 code.

A webpage inside of another is a nested webpage. It is done using the


iframe tag which creates an inline frame. 
<!DOCTYPE html> 
<html> 
<body> 
<h2>HTML Iframes example</h2> 
<p>Use the height and width attributes to specify the size of the ifram
<iframesrc="https://hackr.io/"height="400"width="600"></iframe>
</body> 
</html>

HTML SVG is a two‐dimensional vector and vector/raster graphics. SVG


images and their behaviors are defined in XML text files. It is used for
vector diagrams like pie charts and 2‐dimensional graphs in an X, Y
coordinate system.

<!DOCTYPE html> 
<html> 
<body> 
<h2>HTML SVG example</h2> 
<svg width="400" height="400"> 
<circle cx="50" cy="50" r="40" stroke="black" stroke‐width="6" fill="re
</svg> 
</body> 
</html> 

The button tag lets you create a clickable button in the HTML form on
the webpage. 

<!DOCTYPE html> 
<html> 
<body> 
<h2>HTML Button Tag Example</h2> 
<button name="button" type="button">CLICK ME</button> 
</body> 
</html> 

<!DOCTYPE html> 
<html> 
 <head> 
<style> 
h1{ 
color: red; 
} 
h2{ 
color: blue; 
} 
h3{ 
color: green; 
} 
h4{ 
color: purple; 
} 
h5{ 
color: yellow; 
} 
h6{ 
color: orange; 
} 
</style> 
 </head> 
<body> 
 <h1>This is Heading 1</h1> 
 <h2>This is Heading 2</h2> 
 <h3>This is Heading 3</h3> 
 <h4>This is Heading 4</h4> 
 <h5>This is Heading 5</h5> 
 <h6>This is Heading 6</h6> 
</body>
The script tag embeds client‐side script. It can be inside the head or
body tag of the HTML code. This tag is executed when the browser
reaches that part of the document.

<!DOCTYPE html> 
<html> 
<body> 
<h2>HTML Script Tag Example</h2> 
<script> 
var x = 5; 
var y = 6; 
var result = x + y; 
alert("X + Y is equal to " + result); 
</script> 
</body> 
</html>

<!DOCTYPE html> 
<html> 
<body> 
<h2>HTML Image Example</h2> 
<img src="tulip.jpeg"> 
</body> 
</html>
<!DOCTYPE html> 
<html> 
 <body> 
<h2>HTML Emoji Example</h2> 
<p>&#128512;</p> 
 </body> 
</html> 

Forms are designed to get user input which can later be sent to the
server for processing. Input can be given as text or in the form of radio
buttons and can be submitted by clicking the submit button.

<!DOCTYPE html> 
<html> 
<body> 
<h2>HTML Form Example</h2> 
<form> 
 <label for="fname">First name:</label><br> 
 <input type="text"id="fname"name="fname"><br> 
 <label for="lname">Last name:</label><br> 
 <input type="text"id="lname"name="lname"> 
</form> 
<p> </p> 
<form> 
 <input type="radio"id="male"name="gender"value="male"> 
 <label for="male">Male</label><br> 
 <input type="radio"id="female"name="gender"value="female">
 <label for="female">Female</label><br> 
 <input type="radio"id="other"name="gender"value="other">
 <label for="other">Other</label> 
 <br> </br> 
 <inputtype="submit"value="Submit"> 
</form> 
</body> 
</html> 

Hyperlinks are defined with the HTML <a> tag.

<!DOCTYPE html> 
<html> 
<body> 
<h2>HTML Hyperlink Example</h2> 
<a href="url">link text</a> 
</body> 
</html> 

<!DOCTYPE html> 
<html> 
<body> 
<h2>HTML Color Text Example</h2> 
<h1 style="color:Tomato;">Hello HTML</h1> 
<p style="color:DodgerBlue;">Line 1</p> 
<p style="color:MediumSeaGreen;">Line 2</p> 
</body> 
</html> 
An unordered list is written with the <ul> tag and each element of the
list is with a <li> tag. The list items are displayed as bullets. 

An ordered list is written between <ol> tag and each element of the list
is written with a <li> tag. The list items are displayed as numbers. 

<!DOCTYPE html> 
<html> 
<body> 
<h2>HTML List Example</h2>  
<ul> 
 <li>Coffee</li> 
 <li>Tea</li> 
 <li>Milk</li> 
</ul>  
<ol> 
 <li>Coffee</li> 
 <li>Tea</li> 
 <li>Milk</li> 
</ol> 
</body> 
</html>

The description list allows us to add a description to each element of the


list. 

The <dl> tag defines the description list, the <dt> tag defines the term
﴾name﴿, and the <dd> tag describes each term. 

<!DOCTYPE html> 
<html> 
<body> 
<h2>HTML Description List xample</h2> 
<dl> 
 <dt>Coffee</dt> 
 <dd>‐ black hot drink</dd> 
 <dt>Milk</dt> 
 <dd>‐ white cold drink</dd> 
</dl> 
</body> 
</html> 

If an image cannot be displayed, the alt attribute specifies the alternate


text to be displayed instead.

<!DOCTYPE html> 
<html> 
<body> 
<h2>HTML Alt Example</h2> 
<img src="tulip.jpeg"alt= "Tulip Garden"> 
</body> 
</html> 

These HTML and HTML5 interview questions and answers should be all
you need to get started preparing for your interview. If you’d like,
consider enrolling in this Udemy course.

Don’t forget to actually code to put your learnings to the test. Good
luck!
If you're looking to use your HTML skills to build your own website, we
recommend using NameCheap to buy your domain name and web
hosting services. They're the best in the industry and super affordable.

There are well over 100 tags in HTML. The most frequently used ones
are listed in the HTML questions and answers above.

The HTML basic interview questions at the top of the list above cover
almost everything you need to know as far as the fundamentals are
concerned.

The HR tag adds a horizontal rule or thematic break. It is created using


the <hr>.
People are also reading:

HTML Courses
Difference between HTML vs HTML5 vs XHTML
Jquery Interview Questions
Javascript Certification
Best Javascript Libraries
Java vs Javascript
Javascript Courses
CSS Cheat Sheet
Difference between CSS2 and CSS3

Enter email here

Subscribe Now
By Vijay Singh Khatri

With 5+ years of experience across various tech stacks such as C,


C++, PHP, Python, SQL, Angular, and AWS, Vijay has a bachelor's
degree in computer science and a specialty in technical writing. Also,
he persists in gaining knowledge of content marketing and SEO tools.
He has worked with various analytics tools for over eight years. He is
working with Hackr.io as an SEO manager.
View all post by the author

Disclosure: Hackr.io is supported by its audience. When you purchase through links
on our site, we may earn an affiliate commission.

In this article

Top HTML Interview Questions and Answers

HTML Coding Interview Questions and Answers

Conclusion

Frequently Asked Questions

PHP vs HTML: What is the Difference?

html5 html php PHP vs HTML


Margin vs Padding in HTML and CSS: Differences and
How to Use

Margin vs Padding Margin Padding

10 Best HTML Projects + Source Code in 2023 | Beginner


to Pro

HTML Projects IDE

Get news once a week, and don't worry — no spam.


Manage here

Your email Subscribe

Programming
DevOps
Data Science
Design
Articles
Roadmaps
Programming Tips
Jobs
Help center
About us
We ❤ Feedback
Advertise / Partner
Write for us
Privacy Policy
Terms and Conditions

Disclosure: This page may contain affliate links, meaning when you click the links
and make a purchase, we receive a commission.

A RAPTIVE PARTNER SITE

You might also like