HTML Interview Questions
HTML is a widely used language that gives our webpage a structure. HTML stands for HYPERTEXT
MARKUP LANGUAGE. HTML was created by Berners Lee in 1991.
Read Best Html Interview Questions and answers

Q1. What is HTML and what is it used for?
HTML is a widely used language that gives our webpage a structure. HTML stands for HYPERTEXT
MARKUP LANGUAGE. HTML was created by Berners lee in 1991. A markup language is a set of markups
tags. Every webpage is created in HTML. HTML documents are described in HTML tags.

Q2. What does HTML stand for?
HTML means Hypertext Markup Language.
This language is basically used for creating web applications and also for web pages as well. It is a standard
markup language with cascading style sheets and JavaScript which form a triad for WWW i.e. worldwide
Web.HTML came into existence in 1980 when a great computer professor Sir Tim Berners Lee (a contractor
and author of HTML) proposed an idea in CERN, to basically sharing and using documents. So in this way, a
great language came into existence.

Q3. In which year HTML was first proposed?
Basically, in 1980, A great physicist Sir Tim Berners -Lee who is a contractor at CERN proposed the way
through which documents can be shared easily. So, he prototyped ENQUIRE (a system for CERN), which
would help researchers to use and share documents.HTML Tags was basically the first publicly description of
HTML which was first mentioned by Tim Berners Lee in late 1991. He is usually the professor of computer
programming. He is the author of HTML which is treated to be as the foremost computer languages of all the
times. His idea of writing this language brought a tycoon in the computer technology world and also nowadays
it is also much popular and most trending.

Q4. Who is the author of HTML?
Sir Tim Berners-Lee, a great physicist who is a great personality is the author of HTML. He is also the director
of the World Wide Web Consortium i.e. W3C. He is also the founder of WWWF i.e.World wide Web
Foundation. Open Data Institute is founded by him and also he is director of this institute.H e is a director of the
Web Science Research Initiative i.e. WSRI and a member of the advisory board of the MIT Center for
Collective Intelligence. Sir Tim Berners is a great personality, as he is the professor of the computer department
and also the founder of many institutes and Research initiatives. An idea struck into his mind, how can a
computer be made helpful for using and sharing documents. So, he designed the most trending and tremendous
language, through which it is very easy to make web pages and all. Also, it is most trending and still is in use
rather like other outdated languages.

Q5. What is the meaning of markup in HTML?
The sequence of characters or other symbols which we usually use to insert at certain places in a word or text
file in order to indicate how the file should look when it is displayed or printed or Basically to describe
documents logical structure. The markup indicators are often known as tags. Elements and tags are two different
words which we need to understand as there is a lot of confusion among public related to this fact. It must be
noted that HTML documents contain tags, but do not contain the elements. It is a wide misconception that
usually occurs in mind that both exist in HTML documents.elements are usually only generated after parsing
step from these tags

Q6. What is a physical tag and logical tag in HTML?
A Physical tag has physical text which is used to tell the browser how to display the text enclosed in the
physical tag.
Example for the physical tags are: <big>, <b>, <i>
Logical tags are used to tell the meaning of the enclosed text in it. The example of the logical tag is
<Important>….</Important> tag. When we enclose text in Important tag then it tell the browser that enclosed
text is more important than other text.

Q7. What is a nest in HTML?
If you go and have a look at HTML markup for any webpage today, you will let to know that HTML elements
are contained within other HTML elements. These elements which are inside of other are known as nested
elements and they had become the essential part of building any web page nowadays. The most expertise way to
know more about nesting is just to think about HTML tags in the form of boxes that hold your content which
can be in form of text, images,etc.HTML tags are basically the boxes around the content.

Q8. What is the XHTML?
XHTML means Extensible Hypertext Markup Language, which is basically a part of Family of XML markup
language. It usually extends the most popularly used HTML i.e. Hypertext Markup Language, the pages in
which the web pages are formulated.

Q9. What isCell Spacing and Cell Padding?
Cell Spacing is referred to space/gap between the two cells of the same table.
Cell Padding is referred to the gap/space between the content of the cell and cell wall or Cell border.
Example:
<table border cellspacing=3>
<table border cellpadding=3>
<table border cellspacing=3 cellpadding=3>

Q10. What is the HTML tags?
People always confuse in understanding terms elements and tags. It must be noted that HTML documents
contain tags, but do not contain the elements.It is a wide misconception that usually occurs in mind that both
exist in HTML documents.elements are usually only generated after parsing step from these tags.

Q11. What is an element in HTML?
An HTML element is basically an individual component usually of HTML web page or document.Once if this
has been also parsed into the document object model.HTML nodes is the main part which composes HTML for
example such as text nodes.HTML attributes can be specified from each node. Content, including other nodes
and text, together build up a node. Semantics or meaning are mostly represented by many HTML nodes. Let us
take an example of title node represents the title of the document.

Q12. How many types of lists are available in HTML?
In HTML, we have two types of lists unordered lists and ordered lists. Unordered list starts with <ul> tag and
ends with </ul> tag. Ordered tag starts with <ol> and ends with </ol>. Each list item is written as <li></li>

Q13. How to create mailto link in HTML
Basically, when we usually start with a hyperlink that is Mailto rather than using HTTP or others, the browser
should be able to compose an email in the visitor’s default email program on their computer. There are two
ways to insert a mailto link into a HubSpot page or email, just by inserting a hyperlink into the rich editor or
inputting into the source code. Option one is basically nothing just to insert a mailto link as a hyperlink, also
highlight the text or click on the image as you wish.to apply on the mailto link to for your contacts or visitors to
click on and finally click Add the link to finish. Option two is to Insert a mailto link into the source code and
Click Save to finish then Publish or Update your page.
Example:
<a href=”mailto:someone@example.com?Subject=Hello%20again” target=”_top”>Send Mail</a>

Q14. What does DOCTYPE mean?
DOCTYPE or Document Type Declaration is a type of instruction which usually works in association with
particular SGML or XML documents basically. Let us take an example to understand it more thoroughly, for
example, A Web page with a document type definition i.e. DTD is the best to understand. In a well serialized
and a proper form of the document, It manifests and also the contribution of it is a lot as a short string of markup
that usually conforms to a particular syntax.

Q15. List the media types and formats supported by HTML ?
HTML supports a wide range of media formats for sound, music, videos, movies, and animations. Below is the
list extensions supported by each media format.
Media Type Formats Supported
Images png, jpg, jpeg, gif, apng, svg, bmp, bmp ico, png ico
Media Type Formats Supported
Audio MIDI, RealAudio, WMA, AAC, WAV, Ogg, MP3, MP4
Video MPEG, AVI, WMV, QuickTime, RealVideo, Flash, Ogg, WebM, MPEG-4 or MP4

Q16. What are different types of heading are supported by HTML?
HTML supports 6 types of heading tags they are H1, H2, H3, H4, H5, and H6. H1 is the highest and most
important heading tag.

Q17. What is “Semantic HTML” ?
Semantic HTML or Semantic Markup is HTML that introduces meaning to the web page rather than just
presentation.
<form>, <table>, and <article> are examples of Semantic Elements.
Below are the list of few new Semantic Elements introducted HTML5
<article>
<aside>
<details>
<figcaption>
<figure>
<footer>
<header>
<main>
<mark>
<nav>
<section>
<summary>
<time>

Q18. Who is Known as the father of World Wide Web (WWW)
Tim Berner Lee(Tim Berners-Lee) is known as the father of “World Wide Web”.

Q19. What is the difference between a tag and an element in HTML?
HTML tag is just opening or closing entity.
Example: <p> and </p> are called HTML tags
HTML element encompasses opening tag, closing tag, content (optional for content-less tags)
Example: <p>This is the content</p> : This complete thing is called an HTML element
source: https://stackoverflow.com/questions/8937384/what-is-the-difference-between-html-tags-and-elements

Q20. What is grouping in HTML?
Grouping is used to group several HTML controls like input, textarea, selects as well as labels ( <label>) within
a web form. In HTML <fieldset> element is used for Grouping.

Q21. What is a Fieldset?
The <fieldset> is a tag in HTML that is used to group related elements in a form. It draws a box around the
related elements.

Q22. What is the difference between DIV and SPAN in HTML?
The difference between span and div is that a span element is in-line and usually used for a small chunk of
HTML inside a line (such as inside a paragraph) whereas a div (division) element is block-line (which is
basically equivalent to having a line-break before and after it) and used to group larger chunks of code.
<div id=”scissors”>
<p>This is <span class=”paper”>crazy</span></p>
</div>

Q23. What is the purpose of using alternative texts in images?
The basic purpose of using alternative texts is to define what the image is about. During an image mapping, it
can be confusing and difficult to understand what hotspots correspond to a particular link. These alternative
texts come in action here and put a description at each link which makes it easy for users to understand the
hotspot links easily.

Q24. What is an image map?
Image mapping lets a user to link one image to different web pages in and out of the website. It is the process of
defining special shapes inside an image and link it to different destinations.

Q25. Is there advantages of collapsing white spaces in HTML?
Yes, Collapsing white spaces is one good way of writing HTML codes in an organized way. White spaces act
similar to a single-spaced character and occupy the same size as rest of the characters. By collapsing multiple
white spaces, we can indent lines of text and make the code more readable.

Q26. How do you add a copyright symbol on a HTML page?
Copyright symbol can be either copied and pasted from other sources. Or, you can also add it by writing a small
piece of code: &copy; or & #169; in the required page

Q27.Do all HTML tags come in pair?

No, not all HTMLS tags come in pair. For e.g. <img>, <br>

Q28.What is the advantage of collapsing white space?

– The browser collapses the multiple white spaces into a single white space in HTML.
– This allows the developers to arrange the HTML code in a well organized and legible format.

Q29.Is it possible to list elements straight in an html file?

Yes, it is possible with the use of indents.

Q30.Does a hyperlink apply only to text?

No. The hyperlinks can be applied to both text as well as the images.
– It means that even the images can become clickable links with a capability to take the visitor to the next page.
– This can be done simply by using <a href> tag.

Q31.What is the advantage of using frames?

Frames make it easier to navigate through a site.
– The links that appear in the frame can appear through out the site.

Q32.How can I hide my source?

No. you can’t hide your source as it is required by the browser to display your document.

Q33.How will you align a table to the right or left?

To align the table to the right, you can use <TABLE ALIGN=”right”>
– To align the table to the left, you can use <TABLE ALIGN=”left”>

Q34.How would you automatically transfer your visitors to a new web page?

You can do it with the help of meta tag mentioned below

<META HTTP-EQUIV=”Refresh” CONTENT=”2″; URL=”http://www.yourname.com”>

Place this tag between <HEAD></HEAD> .
– It will load yousite.com in 2 seconds.

Q35.You want only a vertical scrollbar and no horizontal scrollbar on your page. How would you do it?

– This can be done by defining the frame with SCROLLING = auto and having content to just fit into this frame.
– SCROLLING=”yes” gets the scroll bar on both the sides, even when not needed.
– SCROLLING=”no” doesn’t get the scrollbars at all, even when they are needed.

Q36.How do you refer to the .css file in the web page?

css file in the web page can be referred with the use of <link> tag.
– It should be kept between <head></head> tag.
Example

<link href=”/css/mystyle.css” type=”text/css” rel=”stylesheet” />
Q37.What is a better way to design the layout of a web page – a table tag or div?
The better way to design the layout of the webpage is by using the <div> tag.
– The <table> tag is used to present the data in tabular format.
Q38.What are empty HTML elements?
– HTML elements with no content are called empty elements.
– For eg: <br>
Q40.How do I link to a location in the middle of an HTML document?

We can link to a location in the middle of an HTML document. Using Following steps:

1. Label the destination of the link : There are two ways of labeling destination using Anchor:
– NAME attribute:

Example:

<h2><a name=”destination”>Destination: Explanation</a></h2>

– ID attribute:

Example:

<h2 id=”Destination_ID”> Destination: Explanation </h2>

2. Link to the labeled destination : We can link with the destination in the same URL page and with Different URL page.

Example:

Same URL: <a href=”#Destination”> Visit to destination</a> or
Different URL: <a href=”thesis.html#section2″>go to Section 2 of my thesis</a>
Q41.Explain Cell Padding and Cell Spacing.
– Cell Padding : It refers to the gap or space between the cell content and cell border or cell wall.
– Cell Spacing : It refers to the gap between the two cells of same tables.In HTML cell spacing and padding both are used with Table Border layout.

Example:

<table border cellpadding=2>
<table border cellspacing=2>
<table border cellpadding=2 cellspacing=2>
Q42.How to create a button which acts like a link?

To create buttons which act as a hyperlink, there are two ways:

<FORM ACTION=”[url]” METHOD=get>
<INPUT TYPE=submit VALUE=”Text on button”>
</FORM>
<INPUT TYPE=”submit” VALUE=”Go to my link location”
ONCLICK=” http://www.careerride.com/;” />
Q43.What are logical and physical tags in HTML?

– Logical tags are used to tell the meaning of the enclosed text. The example of the logical tag is <strong> </strong> tag. When we enclosed text in strong tag then it tell the browser that enclosed text is more important than other text.

– Physical text are used to tell the browser that how to display the text enclosed in the physical tag.
Some example of the physical tags are: <b>, <big>, <i>

Q44.Does HTML support Javascripts?

Yes, HTML supports JavaScripts. We can use JavaScript anywhere in the HTML Coding. Mainly there are four sections where we can add JavaScript in HTML.

1. Head Section : We can add JavaScript in Head section of HTML.
<head>…..Javascript…. </head>
2. Body Section : <body>….. Javascript…</body>
3. Head and Body both : We can add Javascript in both head and body section.
<body….Javascript…</body> and <head>…..Javascript…. </head>
4. External File : Script in and external file and then include in <head> ….. </head> section.

Q45.Explain marquee tag.

Marquee tag : Marquee tag is used when we want that some text or content move in the web page whether horizontally or vertically.

Syntax of Marquee tag:

<marquee>move text</marquee>

Attribute of Marquee tag are: bgcolor, direction, height, width, vspace etc.

Q46.How do I add midi music to my web page?

We can add midi Music in our HTML web page using following tag:

<bgsound src=”music.mid” loop=”1″>

Attribute LOOP = 1 : Shows that music.mid is played only for one time. We can also set the value of loop to infinite. This tag is supported by Netscape and Internet Explorer.

Example:

<embed src=”canyon.mid” Autostart=TRUE Width=145 Height=60 Loop=true>
Q47.What are new Media Elements in HTML5?
1. <audio> tag : For playing audio.
2. <video> tag : For playing video.
3. <source> tag : For media resources for media elements.
4. <embed> tag : For embedded content.
5. <track> tag : For text tracks used in media players.
Q48.What is difference between HTML and HTML5?
1. Document of HTML is very large as compare to the HTML5.
2. Audio and Video tags are not present in HTML whereas HTML5 contains audio and video tags.
3. Vector technology is not integral part of HTML whereas HTML5 Vector technology is the integral part of it.
4. HTML supported by all old browsers whereas HTML5 is supported by new browser.
5. In HTML web sockets are not available whereas in HTML5 Full duplex communication channel is present.
Q49.What is the Use of SPAN in HTML and give one example?
1. Highlight the any color text
2. For adding colored text
3. For adding background image to text.Example:

<p>
<span style=”color:#000000;”>
In this page we use span.
</span>
</p>
Q50.What is the importance of Doctype in HTML?
Doctype tag is not a HTML tag, it is just an instruction that is passed to the web browser to check for the information that is being provided by the markup language in which the page is written. Doctype is sometimes referred as Document type definition (DTD) that describes some rules that has to be followed while writing the markup language so to make the web browser understand the language and the content correctly. Doctype is very important to be placed in the beginning of the HTML and before the <HTML> tag to allow easy rendering of the pages that are used.
Q51.Differentiate different types of Doctypes from one another

Doctype helps the web browser to correctly render the web pages. There are different types of Doctype that are available and they are as follows:

1. Strict Doctype : It consists of all the HTML elements and it is also known as DTD (Document type definition) but it doesn’t include the presentational and deprecated elements i.e. font, center, etc. Framesets related elements are also not allowed in this.
For example:

<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01//EN” “http://www.w3.org/TR/html4/strict.dtd”>

2. Transitional Doctype : It consists of all the HTML elements and attributes. It is also known as DTD (Document type definition). It includes the presentational and deprecated elements i.e. font, center, etc. Framesets related elements are also not allowed in this.
For example:

<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01 Transitional//EN” “http://www.w3.org/TR/html4/loose.dtd”>

3. Frameset Doctype : It consists of all the HTML elements and attributes. It is also known as DTD (Document type definition). It includes the presentational and deprecated elements i.e. font, center, etc. Framesets related elements are also allowed in this.
For example:

<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01 Frameset//EN” “http://www.w3.org/TR/html4/frameset.dtd”>
Q52.What is the purpose of canvas in HTML?
Canvas is an element that is used for the graphics for the web page. It uses JavaScript to bring the graphics functionality live. It allows easy way to draw the graphics and use different types of tools to create drawing on the web page. Canvas is just a rectangular area that controls the pixel of every element that is used in the web page. Canvas uses methods like paths, circles, etc.
The canvas element will be used as follows:

<canvas id=”can” width=”200″ height=”100″></canvas>

The canvas element includes id, width and height settings and with the javascript it gets used like:

<script type=”text/javascript”>
var c=document.getElementById(“can”);
var ctx=c.getContext(“2d”);
ctx.fillStyle=”#FF0000″;
ctx.fillRect(0,0,150,75);
</script>
Q53.What are the different types of frames tags used in HTML?
Frames allow the display of the document visually. It allows the window to be split into segments that can contain multiple different documents. It can utilize many resources and repeat some parts of the layout that can be used in a frame.

Frames consists of different types of tags and they are as follows:

1. <frameset>…</frameset> : It consists of the frames that includes the layout using the attributes of rows and cols.
2. <frame> or <frame/> : It consists of a single frame and gets included within the frameset. It is always come up with a src attribute that provides the source that has to be shown in a particular frame.
3. <noframes>…</noframes> : It consists of the normal HTML content that is used to show no frames.
4. <iframe>…</iframe> : It consists of internal frame that will contain the src attribute to include the frame that is internal to a particular region.