Html5 Interview Questions

html5-interview-questions

HTML Interview Questions

A rundown of top much of the time asked HTML meet questions and HTML5 inquiries questions and answers are given underneath.

  • HTML5 Interview Questions

1) What is HTML?

HTML represents Hyper Text Markup Language. It is a language of World Wide Web. It is a standard book arranging language which is utilized to make and show pages on the Web. It makes the content more intuitive and dynamic. It can transform text into pictures, tables, links. More subtleties.


2) What are Tags?

HTML tags are composed of three things: an opening tag, content and ending tag. Some tags are unclosed tags.

HTML documents contain two things:

  • content, and
  • tags

At the point when an internet browser peruses a HTML archive, the program peruses it through and through and left to right. HTML labels are utilized to make HTML records and render their properties. Every HTML labels have various properties.

Syntax

  1. <tag> content </tag>

Content is placed between tags to display data on the web page.

 


3) Do all HTML tags have an end tag?

No. There are some HTML tags that don’t need a closing tag. For example: <image> tag, <br> tag.


4) What is formatting in HTML?

The HTML arranging is a cycle of organization the content for a superior look and feel. It utilizes various labels to make text striking, emphasized, underlined.


5) How many types of heading does an HTML contain?

The HTML contains six kinds of headings which are characterized with the <h1> to <h6> labels. Each kind of heading label shows distinctive content size from another. In this way, <h1> is the biggest heading tag and <h6> is the littlest one. For instance:

  1. <h1>Heading no. 1</h1>
  2. <h2>Heading no. 2</h2>
  3. <h3>Heading no. 3</h3>
  4. <h4>Heading no. 4</h4>
  5. <h5>Heading no. 5</h5>
  6. <h6>Heading no. 6</h6>

6) How to create a hyperlink in HTML?

The HTML gives an anchor tag to make a hyperlink that joins one page to another page. These labels can show up in any of the accompanying ways:

  • Unvisited interface – It is shown, underlined and blue.
  • Visited connect – It is shown, underlined and purple.
  • Dynamic connection – It is shown, underlined and red.

7) Which HTML tag is used to display the data in the tabular form?

The HTML table tag is used to show information in even structure (line * segment). It likewise deals with the design of the page, e.g., header area, route bar, body content, footer segment. Here is the rundown of labels utilized while showing the information in the even structure:

TagDescription
<table>It defines a table.
<tr>It defines a row in a table.
<th>It defines a header cell in a table.
<td>It defines a cell in a table.
<caption>It defines the table caption.
<colgroup>It specifies a group of one or more columns in a table for formatting.
<col>It is used with <colgroup> element to specify column properties for each column.
<tbody>It is used to group the body content in a table.
<thead>It is used to group the header content in a table.
<tfooter>It is used to group the footer content in a table.

8) What are some common lists that are used when designing a page?

There are numerous regular records which are utilized to plan a page. You can pick any or a mix of the accompanying rundown types:

  • Requested rundown – The arranged rundown shows components in numbered design. It is spoken to by <ol> tag.
  • Unordered rundown – The unordered rundown shows components in bulleted design. It is spoken to by <ul> tag.
  • Definition list – The definition list shows components in definition structure like in word reference. The <dl>, <dt> and <dd> labels are utilized to characterize portrayal list.

9) What is the difference between HTML elements and tags?

HTML components convey to the program to deliver text. At the point when the components are encased by sections <>, they structure HTML labels. More often than not, labels arrive in a couple and encompass content.


10) What is semantic HTML?

Semantic HTML is a coding style. It is the utilization of HTML markup to strengthen the semantics or significance of the substance. For instance: In semantic HTML <b> </b> tag isn’t utilized for strong explanation just as <i> </i> tag is utilized for italic. Rather than these we use <strong></strong> and <em></em> labels.


11) What is an image map?

Picture map encourages you to connect a wide range of pages utilizing a solitary picture. It is spoken to by <map> tag. You can characterize shapes in pictures that you need to make a piece of a picture planning.


12) How to insert a copyright symbol on a browser page?

You can insert a copyright symbol by using &copy; or &#169; in an HTML file.


13) How to create a nested webpage in HTML?

The HTML iframe tag is utilized to show a settled site page. At the end of the day, it speaks to a website page inside a page. The HTML <iframe> tag characterizes an inline outline. For instance:

  1. <!DOCTYPE html>
  2. <html>
  3. <body>
  4. <h2>HTML Iframes example</h2>
  5. <p>Use the height and width attributes to specify the size of the iframe:</p>
  6. <iframe src=“https://www.javatpoint.com/” height=“300” width=“400”></iframe>
  7. </body>
  8. </html>

14) How do you keep list elements straight in an HTML file?

You can keep the list elements straight by using indents.


15) Does a hyperlink only apply to text?

No, you can utilize hyperlinks on content and pictures both. The HTML anchor tag characterizes a hyperlink that joins one page to another page. The “href” quality is the main property of the HTML anchor tag.

Syntax

  1. <a href = “………..”> Link Text </a>

16) What is a style sheet?

A template is utilized to fabricate a reliable, movable, and all around planned style layout. You can include these formats a few diverse website pages. It depicts the look and designing of an archive written in markup language.


17) Can you create a multi-colored text on a web page?

Indeed. To make a multicolor book on a website page you can utilize <font shading =”color”> </font> for the particular writings you need to shading.


18) Is it possible to change the color of the bullet?

The color of the bullet is always the color of the first text of the list. So, if you want to change the color of the bullet, you must change the color of the text.


19) Explain the layout of HTML?

HTML layout specifies a way in which the web page is arranged.

HTML Layouts

Every website has a specific layout to display content in a specific manner.

Following are different HTML5 elements which are used to define the different parts of a webpage.

  • <header>: It is used to define a header for a document or a section.
  • <nav>: It is used to define a container for navigation links
  • <section>: It is used to define a section in a document
  • <article>: It is used to define an independent, self-contained article
  • <aside>: It is used to define content aside from the content (like a sidebar)
  • <footer>: It is used to define a footer for a document or a section

20) What is a marquee?

Marquee is utilized to put the looking over content on a site page. It look over the picture or text up, down, left or right consequently. You should put the content which you need to look inside the <marquee>……</marquee> tag.


21) How many tags can be used to separate a section of texts?

Three tags are used to separate the texts.

  • <br> tag – Usually <br> tag is used to separate the line of text. It breaks the current line and conveys the flow to the next line
  • <p> tag – The <p> tag contains the text in the form of a new paragraph.
  • <blockquote> tag – It is used to define a large quoted section. If you have a large quotation, then put the entire text within <blockquote>………….</blockquote> tag.

22) How to make a picture of a background image of a web page?

To make a picture a background image on a web page, you should put the following tag code after the </head> tag.

  1. <body background = “image.gif”>

Here, replace the “image.gif” with the name of your image file which you want to display on your web page.


23) What are empty elements?

HTML elements with no content are called empty elements. For example: <br>, <hr> etc.


24) What is the use of a span tag? Give one example.

The span tag is used for following things:

  • For adding color on text
  • For adding background on text
  • Highlight any color text

Example:

  1. <p>
  2. <span style=“color:#ffffff;”>
  3. In this page we use span.
  4. </span>
  5. </p>

25) What is the use of an iframe tag?

An iframe is used to display a web page within a web page.

Syntax:

  1. <iframe src=“URL”></iframe>

Example:

  1. <iframe src=“demo_iframe.html” width=“200px” height=“200px”></iframe>

Target to a link:

  1. <iframe src=“http://www.javatpoint.com” name=“iframe_a”></iframe>

26) What are the entities in HTML?

The HTML character elements are utilized as a trade for held characters in HTML. You can likewise supplant characters that are absent on your console by elements. These characters are supplanted in light of the fact that a few characters are saved in HTML.


27) Why is a URL encoded in HTML?

A URL is encoded to change over non-ASCII characters into an arrangement that can be utilized over the Internet in light of the fact that a URL is sent over the Internet by utilizing the ASCII character-set as it were. On the off chance that a URL contains characters outside the ASCII set, the URL must be changed over. The non-ASCII characters are supplanted with a “%” trailed by hexadecimal digits.


28) Does a <!DOCTYPE html> tag is a HTML tag?

No, the <!DOCTYPE html> declaration is not an HTML tag. There are many type of HTML e.g. HTML 4.01 Strict, HTML 4.01 Transitional, HTML 4.01 Frameset, XHTML 1.0 Strict, XHTML 1.0 Transitional, XHTML 1.0 Frameset, XHTML 1.1 etc. So, <!DOCTYPE html> is used to instruct the web browser about the HTML page.


HTML5 Interview Questions

Let’s see a list of top HTML5 interview questions and answers.


29) What is the canvas element in HTML5?

The <canvas> component is a holder that is utilized to draw illustrations on the website page utilizing scripting language like JavaScript. It considers dynamic and scriptable delivering of 2D shapes and bitmap pictures. There are a few techniques in material to draw ways, boxes, circles, text and add pictures. For Example:

  1. <canvas id=“myCanvas1” width=“300” height=“100” style=“border:2px solid;”>
  2. Your browser does not support the HTML5 canvas tag.
  3. </canvas>

30) What is SVG?

HTML SVG is utilized to depict the two-dimensional vector and vector/raster illustrations. SVG pictures and their practices are characterized in XML text records. So as XML records, you can make and alter a SVG picture with the content manager. It is generally utilized for vector type outlines like pie diagrams, 2-Dimensional charts in a X, Y arrange framework.

  1. <svg width=“100” height=“100”>
  2.  <circle cx=“50” cy=“50” r=“40” stroke=“yellow” stroke-width=“4” fill=“red” />
  3. </svg>

31) What are the different new form element types in HTML 5?

Following is a list of 10 frequently used new elements in HTML 5:

  • Color
  • Date
  • Datetime-local
  • Email
  • Time
  • Url
  • Range
  • Telephone
  • Number
  • Search

32) Is there any need to change the web browsers to support HTML5?

No. Almost all browsers (updated versions) support HTML 5. For example Chrome, Firefox, Opera, Safari, IE.


33) Which type of video formats are supported by HTML5?

HTML 5 supports three types of video format:


34) Is audio tag supported in HTML 5?

Yes. It is used to add sound or music files on the web page. There are three supported file formats for HTML 5 audio tag.

  1. mp3
  2. WAV
  3. Ogg

Let’s see the code to play mp3 file using HTML audio tag.

  1. <audio controls>
  2.   <source src=“koyal.mp3” type=“audio/mpeg”>
  3. Your browser does not support the html audio tag.
  4. </audio>

Instead of koyal.mp3, you can pass any mp3 file name.


35) What is the difference between progress and meter tag?

The advancement tag is utilized to speak to the advancement of the undertaking just while the meter tag is utilized to gauge information inside a given reach.


36) What is the use of figure tag in HTML 5?

The figure tag is utilized to add a photograph in the report on the website page. It is utilized to deal with the gathering of charts, photographs, code posting with some implanted substance.

  1. <p>The Taj Mahal is widely recognized as “the jewel of Muslim art in India and one of the universally admired masterpieces of the world’s heritage.”</p>
  2. <figure>
  3.   <img src=“htmlpages/images/tajmahal.jpg” alt=“Taj Mahal”/>
  4. </figure>

37) What is the use of figcaption tag in HTML 5?

The <figcaption> component is utilized to give a subtitle to a picture. It is a discretionary tag and can show up previously or after the substance inside the <figure> tag. The <figcaption> component is utilized with <figure> component and it tends to be put as the first or last offspring of the <figure> component.

  1. <figure>
  2.   <img src=“htmlpages/images/tajmahal.jpg” alt=“Taj Mahal”/>
  3. <figcaption>Fig.1.1 – A front view of the great Taj Mahal in Agra.</figcaption>
  4. </figure>

38) What is button tag?

The button tag is used in HTML 5. It is used to create a clickable button within the HTML form on the web page. It is generally used to create a “submit” or “reset” button. Let’s see the code to display the button.

  1. <button name=“button” type=“button”>Click Here</button>

39) What is the use of details and summary tag?

The subtleties tag is utilized to determine some extra subtleties on the page. It very well may be seen or covered up on interest. The synopsis tag is utilized with subtleties tag.


40) What is datalist tag?

The HTML 5 datalist tag gives an autocomplete include on the structure component. It encourages clients to pick the predefined choices to the clients to choose information.

  1. <label>
  2.  Enter your favorite cricket player: Press any character<br />
  3.  <input type=“text” id=“favCktPlayer” list=“CktPlayers”>
  4.  <datalist id=“CktPlayers”>
  5.  <option value=“Sachin Tendulkar”>
  6.  <option value=“Brian Lara”>
  7.  <option value=“Jacques Kallis”>
  8.  <option value=“Ricky Ponting”>
  9.  <option value=“Rahul Dravid”>
  10.  <option value=“Shane Warne”>
  11.  <option value=“Rohit Sharma”>
  12.  <option value=“Donald Bradman”>
  13.  <option value=“Saurav Ganguly “>
  14.  <option value=“AB diVilliers”>
  15.  <option value=“Mahendra Singh Dhoni”>
  16.  <option value=“Adam Gilchrist”>
  17.  </datalist>
  18. </label>

41) How are tags migrated from HTML4 to HTML5?

No.Typical HTML4Typical HTML5
1)<div id=”header”><header>
2)<div id=”menu”><nav>
3)<div id=”content”><section>
4)<div id=”post”><article>
5)<div id=”footer”><footer>

Header and Footer Example

HTML 4 Header and Footer:

  1. <div id=“header”>
  2.   <h1>Monday Times</h1>
  3. </div>
  4. .
  5. .
  6. .
  7. <div id=“footer”>
  8.   <p>&copy; JavaTpoint. All rights reserved.</p>
  9. </div>

HTML 5 Header and Footer:

  1. <header>
  2.   <h1>Monday Times</h1>
  3. </header>
  4. .
  5. .
  6. .
  7. <footer>
  8.   <p>© JavaTpoint. All rights reserved.</p>
  9. </footer>

Menu Example

HTML 4 Menu:

  1. <div id=“menu”>
  2.   <ul>
  3.     <li>News</li>
  4.     <li>Sports</li>
  5.     <li>Weather</li>
  6.   </ul>
  7. </div>

HTML 5 Menu:

  1. <nav>
  2.   <ul>
  3.     <li>News</li>
  4.     <li>Sports</li>
  5.     <li>Weather</li>
  6.   </ul>
  7. </nav>

42) If I do not put <!DOCTYPE html> will HTML 5 work?

No, the browser will not be able to identify that it is an HTML document and HTML 5 tags do not function properly..


43) What is the use of the required attribute in HTML5?

It forces a user to fill text on the text field or text area before submitting the form. It is used for form validation.

Example:

  1. Name: <input type=“text” name=“name” required>

44) What are the new <input> types for form validation in HTML5?

The new input types for form validation are email, URL, number, tel, and date.

Example:

  1. <input type=“email”>