Tutorial Study Image

HTML Interview Questions

Hypertext Markup Language

HTML is the most widely used markup language for developing and structuring web pages on the internet. It defines as the building blocks of our webpage.
 

No, Html is not a programming language.

Generally, Programming languages have some sort of functional purposes whereas HTML contains no programming logic and it doesn’t execute anything in the sense that a programming language does. It is a markup language for developing and structuring web pages on the internet.

HTML5 was first released in a public-facing form on 22 January 2008.

With a major update; HTML5 was released as a W3C recommendation on 28 October 2014 which brought the specification process to completion. However, HTML5.1 and HTML5.2 were released as recommendations by W3C on 1 November 2016 and on 14 December 2017 respectively.

HTML <!DOCTYPE> tag is an instruction to give information to the browser about the version or type of HTML used in the document.  It is called the document type declaration (DTD).
The <! DOCTYPE> declaration can be defined in Html5 as: 
<! DOCTYPE html>

<!-- DOCTYPE html-->
<!-- DOCTYPE html--><!-- DOCTYPE html-->

Every HTML document requires a document type declaration to ensure that the pages are displayed in the way they are intended to be displayed. So according to the HTML specification or standards, we write a Doctype declaration at the top of each HTML page before all other elements which tell the browser to open this web page in a standard model and it acquaints the web page with the latest edition of HTML without specifying the specific versions.

If we do not mention <!DOCTYPE> in an HTML page, the browser will get no information about the version of the HTML used in that specific web page, and the browser can’t get the latest features of HTML and get stuck with the old ones.

No, some tags like <img>, <br> etc. does not have any pair.

Whatever written inside angle brackets ‘<’ and ‘>’ are called tags which are usually used to mark up the start of an HTML element. An example of a tag is: <h1>.

Whatever is written within an HTML tag is called HTML elements. It specifies the general content.
 

Tags and attributes are the basis of HTML. HTML tag starts with < and ends with > and it is used to mark up the start of an HTML element
 
HTML attributes are used to describe the character of an HTML element in detail. It founds only in the starting tag.

Yes, Most of the older files can work on the newer browsers, but it could be possible some of the features may not work, because of the new features.

If the user operating system does not support some HTML characters, then the user won’t be able to read the character because the operating system will show some random square or circle-like characters or show it as an image instead.

The tags that do not have any closing tags are called empty tags which contain only the opening tag but they perform some action in the webpage. Generally, we can say that the Empty elements are self-closing or void and not container tags, for example <br>.

There is no text between a tag means that there is nothing to format. So, when we execute the HTML file on the browser we would get nothing on the screen.
 

No, when we create <a> tag it accepts only one href attribute.

 

The elements between <head> and </head> tag act as a container for metadata and it typically defines the document title, character set, styles, scripts, and other meta information.  Head tag should be placed between the <html> tag and the <body> tag.
 

The title of the HTML document is defined with the <title> tag. It displays a title for the page in the browser’s title bar or the page’s tab. The title of the document must be text only.

The <u> tag is used to underline the text in the Html document. The <u> tag was deprecated in HTML, but then they were re-introduced in HTML5.

We can use the <b>  </b> tag or <strong> </strong> tag to  bold text  in HTML,.
<b> Hello</b>
 

There are two types of HTML elements: inline and block-level. 

Inline elements take up the space bounded by the tags defining the element, instead of breaking the flow of the content. It does not start on a new line and only occupies as much width as necessary.

A block-level element occupies the entire horizontal space of its parent element (container), and vertical space is equal to the height of its contents, thereby creating a "block". The block-level element always starts on a new line both before and after the element and occupies the full width available. You can indicate them as a stack of boxes.
 

HTML <q> tag and <blockquote> tag are used to display HTML quotes on your html page. Generally <q> tag is used to put a short quotation on your website and the <blockquote> tag is used to define a large quotation on your website.

There are six types of heading tags in HTML which are defined with the <h1> to <h6> tags. <h1></h1> tag is giving the biggest font size among the heading tags. Usually, the font size of the header text decreases from tag <h1> to <h6>.

We can add space to the web page by using the space bar. Generally, HTML displays one space between words, no matter how many times you have entered the space bar. The simplest way to add a space in an HTML page is with the non-breaking space entity, written as &nbsp; or &#160; which is used to force an extra space. That means it helps to prevent a line break at its location.

You can also use the additional HTML entities &ensp; and &emsp; to add two and four non-breaking spaces respectively.

<!DOCTYPE html>
 <html>
    <head>
        <title>
            HTML Example
        </title>
    </head>
     <body> 
       <h1> Study of HyperText Markup Language</h1>
    </body>
</html>

HTML tables help web developers to set the data into rows and columns of cells. The HTML tables are specified by using the <table> tag in which the <tr> tag is used to create table rows and <td> tag is used to create data cells. The elements under <td> are regular and left-aligned by default.

The <th> tag is used to specify a table heading. If your text is in the <th> elements then they will be bold and centered. You can set table background by using either the bgcolor attribute or the background attribute.

We separate a section of texts in HTML using the below tags:

  •  <br> tag – It is used to produce a line break in text and shifts the flow of the text to a new line. 
  • <p> tag–This tag is used to define a paragraph of text on the html page. The text inside the <p> and </p> tags will be considered as one paragraph.
  •  <blockquote> tag–This tag is mainly used to define a section that is quoted from another source.

The <em> tag is used to produce emphasized text.

  • Ordered list
  •  Unordered list
  •  Definition list

In HTML Unordered list, all the list items are marked with bullets. It is also known as a bulleted list. The Unordered list is defined with <ul> tag and list items start with the <li> tag.


In the ordered HTML lists, all the list items are marked with numbers by default rather than bullet points. It is also known as a numbered list. The ordered list is defined with the <ol> tag and the list items start with the <li> tag.

One of the important list styles is the HTML Description list, which is supported by HTML and XHTML. It is also known as a definition list where entries are listed like a dictionary or encyclopedia.
The HTML definition list contains the following three tags:

  1. <dl> tag – It is used to define the start of the list.
  2.  <dt> tag – It is used to define a term.
  3.  <dd> tag – It is used to define the term definition (description).

By using indents, you can keep the list elements straight. 

Yes. You can include a list within another list by using the nested list concept.


A nested list can be defined as the combination of all other lists such as ordered, unordered, and definition lists. For example, if you want to create a bullet list inside a numbered list then such type of list will be termed as a nested list.

Yes. The bullet takes the color from the first line of the list. So, to change the color of the bullet, you should change the text color of the first line in the list. 
 

We can insert a comment in HTML by using the comment tag which begins with a lesser than sign “<!-“and ends with a greater than sign “->”. The data, which are placed inside the comment tag, are not displayed in the browsers.
 For example, <! – Comment –>. 

The <button> tag is used to define a clickable button.

Example:
<button type="button">Click Here!</button>

In HTML, <input type="button" /> is used to create buttons in an HTML form. Using HTML forms, you can easily take user input.  

In the case of a button tag, you can create a Button anywhere for a general-purpose. It is used to redirect to any link and is not restricted to a form action. By using a <button> element you can put text and tags like <b>, <i>, <br>, <strong>, <img>, etc. That is not possible with a button created with the <input> element.
 

<div class='myDiv'>
nbsp;       <button 1</button>
nbsp;       <button 2</button>
        <button>Button 3</button>
</div>
 

 

The HTML <span> element stands for a generic inline container for marking up a part of a text, or a part of a document. That means it can be used for styling purposes to the grouped inline elements by using class and id attribute or inline style.

Both the tags (<div> and <span>) are used to represent the part of the webpage. The <span> tag is much like the <div> element, but <div> is used as a block-level element and <span> is an inline element. Div tag can accept align attribute but <span> tag does not accept align attribute. Div tag should be used to wrap a section, for highlighting that section, but <span> tag should be used to wrap any specific word that you want to highlight in your webpage.

 

You can use the  tag to specify the text color.

Example:

  1. < font Color=”red”>  
  2. < font color=”rgb(128,128,0)”>
  3. < font color=”#00FF00″>

 

Yes. You can create a multicolor text on a web page by using <font> tag. That means apply <font color ="color"> </font> for the specific texts you want to color.
 

By using &copy; or &#169; you can insert a copyright symbol in an HTML document.

Some elements in HTML only need an opening tag which does not need a close tag, but they do some actions on the web page and these tags are known as void elements. Some examples are <br />, <img />, <hr />, etc.
 

No, the <body> tag is not an empty element or void element. It is a container tag.
 

Whitespace is an empty sequence of space characters composed only of spaces, tabs, or line breaks. It will help you to organize your code in a way that will make it easily readable by yourself and other people.
 

The <marks> tag is used for highlighting the text. 

Syntax:
<mark>This is highlighted text </mark>

CSS (Cascading Style Sheet) is the file format that describes how HTML documents are presented on the screen. It provide easy and effective alternatives to style web documents by using different styling features like changing the color of the text, increasing or decreasing font size, alignment for the HTML tags, etc. 
 

HTML stands for HyperText Markup Language and it is the language that is used to define the structure of a web page.

CSS stands for Cascading Style Sheets and it is used to style web documents by using different styling features.

The following table summarizes some of the basic differences between HTML and CSS.

HTML CSS
HTML is used to define a structure of a web page  CSS is used to style the web documents
We cannot write HTML code inside a CSS sheet.  We can write CSS code inside an HTML document.
It consists of tags and elements. It consists of selectors and declaration blocks.
 HTML doesn’t have further types. Depending upon the requirement, we can use CSS as internal or external.
It is not used for presentation and visualization. It is mainly used for presentation and visualization.
 Comparatively less backup and support.

 Comparatively higher backup and support.

 

HTML attributes are special words used to define additional characteristics or properties of the element, which should always be applied with an opening tag. That means attributes are the modifier of the HTML element. Moreover, you can use multiple attributes in one HTML element, but need to give space between two attributes. 

To create several links to different sections within the same web page, we can use the <a> tag, along with referencing through the use of the # symbol.
 

The pound(#) sign is not a simple regular character but has a special function which is used to link to the part of the same webpage. It is known as named anchor or sometimes as a fragment.

Basically to navigate the user to some specific heading of the long website we use the pound sign with the name of that heading in the anchor tag. When used empty with no other dub heading, the same link navigates to the top of the same page.

We use the anchor tag <a> to create a hyperlink in an HTML document that helps to link one page to another page. The hyperlink can be added to images too. 
 

Yes, a hyperlink can be applied to images.

The href attribute is used to specify the URL of the page, which want to link. If the href attribute is not present, the <a> tag will not be a hyperlink. You can use href=”#top” or href=”#” to link to the top of the current page.

 

We can adjust the sizes of the linked resource by using the sizes attributes in the <link> tag in HTML. 

Syntax:
    <link sizes="HeightxWidth | any">

Here, the ‘HeightxWidth’  is used to specify the value of the height and width of a linked icon. The ‘any’ specifies that the icon is scalable like an SVG or PNG image.
 

If you want to collect the information from the site visitors then you can use the HTML Forms. The form will collect input from the user and then will pass it to a back-end application like CGI, ASP Script or PHP script, etc, which will process that data based on defined logic inside the application.

The HTML <form> tag is used to create an HTML form and there are various form elements such as text fields, password fields, text area fields, drop-down menus, radio buttons, checkboxes, etc.

The Text input control displays the obtained text in unencrypted form whereas password input control hides the input character as soon as a user enters it and replacing them with encrypted form such as dots, stars, or boxes.

An image map in HTML helps in linking with the different kinds of web pages by using a single image. That means when you click on the clickable areas of an image, it will open to new or the provided destination. 
 

HTML <map> tag is used with <area> tag to define a client-side image map. That means you can easily link any part of the image to other documents, without dividing the image with the help of the <map> tag.

The Marquee HTML tag is a non-standard HTML element that creates a scrolling text or image that can go in a specific direction across the screen i.e. left, right, up, or down, automatically. 

Example: <marquee>Text to scroll </marquee>.
 

The alt attribute is the HTML attribute that is to be displayed as an alternative text in place of an image whenever the image cannot be loaded due to any technical issues.
 

Yes, Html5 can support sound or music files on the web page by using audio tag. HTML 5 audio tags has mainly three supported file formats that are mp3, ogg and WAV .

 

There are different attributes for Html audio tags such as src, controls, muted, loop, autoplay, and preload.

  • Src: It defines the source URL of the audio file.
  • Controls: It specifies the audio controls which are displayed with play/pause buttons.
  • Autoplay: It plays the audio automatically without the user’s permission as soon as it is loaded by the web browser.
  •  Loop: It defines that the audio file will start over again, whenever it is completed.
  •  Muted: It is used to mute the audio output.
  •  Preload: It defines the author view to upload the audio file when the page loads.

The div tag stands for the Division tag. The div tag in HTML is used to make a group of HTML elements together which helps to apply CSS styles to many elements at once. That means the div tag is a block-level tag and it is just like a container unit that helps us to create a particular section for particular data or functionality in the web pages. 

A style sheet is used to describe how HTML documents are presented on the screen and you can provide several style properties for given HTML elements. So, it helps to create a well-defined template for an HTML webpage. Moreover, we can link a single style sheet template to various web pages, which makes it easier and more effective alternatives to maintain and change the look of the website.
 

The <code> tag is utilized to define a piece of computer code. The content inside is exhibited in the browser's default monospace font. 

Syntax:
<code> This is computer code </code>
 

The SVG stands for Scalable Vector Graphics (SVG). It is an XML-based image format. It is used to describe the vector or raster graphics for the web. A vector image can be scaled up or down to any extent without losing the image quality. 

Generally, we use it for vector-type diagrams like pie charts, 2-Dimensional graphs in an X, Y coordinate system.

Example:
<svg width="100" height="100">
      <circle cx="50" cy="50" r="40" stroke="yellow" stroke-width="4" fill="red" />
</svg>
 

The Html <canvas> tag is used to draw graphics on a web page via scripting. It is only a container. So you should have used script to draw graphics. Generally, you can draw paths, boxes, circles, text, and add images by using the methods of the canvas.
Let’s see the syntax of the <canvas> element.

Syntax:
<canvas id="myCanvas" width="200" height="100"></canvas>
 

 

Generally, a webpage within another webpage is known as a nested web page. We can create nested web pages in HTML by using the built-in iframe tag. That is, the <iframe> tag will help the browser to display a separate html document into a defined rectangular region of the current HTML document. 


 For example:

<!DOCTYPE html>
<html>
   <head>
      <title>HTML Iframes</title>
   </head>
  <body>
      <p>Document content goes here...</p>
      <iframe src = "C:\learnetutorials\HtmlPrograms\Form.html" width = "555" height =      "200" frameborder="1" scrolling = "yes">
      Sorry your browser does not support inline frames.
      </iframe>
      <p>Document content also go here...</p>
   </body>
</html>

HTML subscript text can be implemented by using the <sub> tag, which normally appears half a character below the normal line, and is sometimes rendered in a smaller font. 

Syntax:
This is an example of <sub> subscript </sub>
 

We can insert a superscripted text in Html by using the <sup> tag. This superscript text has a smaller font and appears with a raised baseline. 

For example, when dealing with an equation of mass-energy equivalence such as E=mc2, the number 2 is rendered as superscript. 

Syntax:
This is an example of superscript E=MC<sup> 2 </sup>
 

The <del> tag is used to represent a range of text that has been deleted or erased from a document. It will strike a line through deleted content.

Syntax:
This is an example of <del>deleted text</del>.
 

HTML <ins> tag is used to indicate the newly added text in an HTML document. It represents a range of text with an underline that has been added to the document.
Syntax:
This is an example of <ins>inserted text</ins>
 

An HTML document will include the script file by using the <script> tag.

Web applications can locally store data within the browser on the client-side by using the web storage feature. It stores data in the form of key/value pair on the browser. Web Storage is sometimes also known as DOM storage.
 

HTML5 has two types of Web storage:

  • Local Storage: It uses Windows.localStaorage object which helps to store data and is available for every page. In this storage, the data does not get deleted even the browser is closed, to delete the data we have to manually visit the browser setting.
  • Session Storage: It uses Windows.sessionStorage object which helps to store data for one session and once we closed the window or browser tab the data get lost
  • It can store 5 to 10 MB of data which is more than what a cookie could have.
  •  Web storage data cannot be transferred with an HTTP request, so it increases the performance of the application.
  1. Users can delete cookies. Unless the user deletes cookies, they will be a part of the hard drive space. Eventually, this will lead to slows down or lags the browser.
  2.  It does not allow the complex type of data.
  3.  They cannot store a large amount of information. So it leads to size limitation problems on cookies.
  4.  Cookies are stored as text files on the client machine and they may pose some serious security risks as anyone can easily open these files and tamper with cookies.
  5. If the security level is set too high in the browser then cookies will not work.

We can make a picture as a background image of a web page by using following syntax after the </head> tag.

Syntax
<body background =”name of image file with extension">  
 

No, the <!DOCTYPE html> declaration is not an HTML tag. There are many type of HTML. So, here we use <!DOCTYPE html> to instruct the web browser about the HTML page.

  • Semantic elements give a clear meaning about the content they contain and only work on a specific flow. For example, < form> element as by its name itself this element is used to create a form in web pages and it gives a proper meaning.
  •  Non-Semantic elements in HTML don’t tell a proper meaning about the content they contain. For example, <spam> and <div>.
     

Yes. By using the HTML 5 feature Geolocation API, we can retrieve the location of a user.

One of the important features of HTML5 is the Drag and Drop which allows the user to grab any object on the page, drag it and drop it to a different location with the help of a mouse. That means to drag the elements into another location by holding the mouse button down over an element and drop the element where you want by releasing the mouse button.

The user can drag only those HTML elements which have the draggable attribute is true. Example:

< img draggable ='true'/ src='img.png'>

The drag object of the page can only drop to some specific location where the ondragover event is specified. Example:
< div >
 

If we want to add the video in the Html document, then The HTML <video> element is used at that point where we want to add the video in the Html document. 
Example:
<video width="320" height="240" controls>
      <source src="movie.mp4" type="video/mp4">
      <source src="movie.ogg" type="video/ogg">
Your browser does not support the video tag.
</video>

The progress tag is used to represent the progress of the task only by creating a progress bar on the website while the meter tag is used to measure data within a given range.
 

HTML 5 supports mainly three types of video format:

  •  mp4
  •   Ogg
  •  WebM

If we want to add the video from Youtube in your Html document, then we have to use the <iframe> tag at that point where we want to embed the Youtube video in the Html document. We can add several attributes within the <iframe > tag whose names are "src”, “height” and “width”, etc.
Example:
<iframe height="400" width="500"    
src="https://www.youtube.com/embed/d58D3PPKsjE">
</iframe> 

The figure tag is used to mark up or add a photo on the web page and it can handle the group of diagrams, photos, code listing with some embedded content.
 

The <figcaption> element is used with <figure> element to add a caption for the photo

We can use the HTML <blink> tag to blink text in HTML. The <blink> HTML element is a non-standard element, which helps to create a blinking of the enclosed text that flashes slowly.

The <meta> is the tag used to specify metadata in HTML. With the help of the <meta> tag, you can specify the page description, copyright, keywords, language, author of the documents, etc. which generally does not display on the webpage, but the search engines can  scan the webpage by using metadata to know about the webpage.
 

HTML and XHTML has a few differences as below:

HTML XHTML
Stands for Hypertext Markup Language Stands for Extensible Hypertext Markup Language
Markup file format Document file format
It is not necessary to close tags in the same order as they were opened It is necessary to close tags in the same order as they were opened
It is not needed to write doctype on the top of the file It is quite important to write doctype on the top of the file
The filename extension used in HTML are .html, .htm.

The filename extension used in XHTML are .xhtml, .xht, .xml.

 

The HTML tag <iframe> is used to indicate an inline frame. It is used to embed another document within the current HTML document. That is, the <iframe> tag will help the browser to display a separate html document into a defined rectangular region of the current HTML document, which includes scrollbars and borders. 
 

HTML HTML5
It doesn’t allow audio and video controls without the use of flash player support. It allows audio and video controls with the use ofand

tags.

Long and complicated Character encoding. Simple and easy Character encoding.
It does not allow JavaScript to run in the browser. JS Web worker API in HTML5 will help you to run JavaScript in the background.
It stores temporary data by using cookies. SQL databases and application cache are used to store offline data.
It does not allow drag and drops effects. It allows drag and drop effects.
Long and complicated Doctype declaration. Simple and easy Doctype declaration.
We can’t draw shapes like circles, rectangles, triangles, etc in HTML. We can draw shapes like circle, rectangles, triangles, etc.
The older version of HTML is not a mobile-friendly markup language. HTML5 language is a more mobile-friendly markup language.
It works with all old browsers. All-new browser like Firefox, Mozilla, Chrome, Safari, etc supports HTML5.

 

By using the PHP script we can able to generate the HTML code. Also, we can able to pass the values from HTML to PHP code.