In this tutorial we will learn all important html interview questions and also learn html5 interview questions with answers.
1) What is HTML? | What Does HTML stand for?
HTML is a hypertext markup language for creating web pages.
- HTML full form : Hyper text markup language.
- HTML describes the structure of web page.
- HTML consists of series of elements.
- HTML element tells the browser that how to display the content.
2) What is HTML tags?
Html tags are used to mark up the start/opening and end/closing tags.
Tags are two types-
- Opening tags
- Closing tags
Example - <p> This is opening tag.
</p> This is closing tag.
3) What is HTML elements?
An HTML element usually consists of a starting tag & end tag.
Example - <p> This is the content of the paragraph element </p> .
4) What is HTML attributes?
Attributes provide additional information about an element and attributes are always specified in the start tag.
All attributes have of two parts -
- A name part
- A value part
Example -
<a href="https://www.teknowize.com" target="_blank" title="click here">
5) Is all HTML tag have an end tag ?
No,some HTML tag not need a closing tag.
For example -
<image> tag , <br> tag ,<hr> tag etc.
6) Formatting in HTML is what?
It is a process in which the text is formating for a better look. It use many type of tags for making text bold, italic, underline etc.
7) How many type of heading tag in HTML?
The HTML has six types of heading tag. The H1 tag is the largest heading tag and the H6 is the smallest heading tag.
<h1> Heading No 1 </h1>
<h2> Heading No 2 </h2>
<h3> Heading No 3 </h3>
<h4> Heading No 4 </h4>
<h5> Heading No 5 </h5>
<h6> Heading No 6 </h6>
8) How to create a hyperlink in HTML?
HTML have a tag which is called as ancor tag , which use to create a hyperlink that link one webpage to another webpage.
The ancor tag appear in three ways -
Unvisited link
Visited link
Active link
9) HTML tags which display data in tabular form?
In HTML, the table tag displays the data in tabular form ( row * column ).Layout for the page e.g., header section, navigation bar, body content, footer section also managed by table tag.
List of tags used when displaying the data in tabular form -
Tag |
Description
|
<table> | It defines a table. |
<tr> | It define a row in a table. |
<th> | It define a header cell in a table. |
<td> | It defines a cell in a table. |
<caption> | It define the table caption. |
<colgroup> | It specified a group of one or more columns in a table for formatting. |
<col> | It is use with <colgroup> element to specify column properties for each column. |
<tbody> | It is use 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. |
10) Explain all type of list which used when designing a webpage?
There are many types of list are available but two types of list are commonly use
- Order list - In the order list, elements are displayed in number format. The tag of the order list is <ol>.
- Unorder list - In the unorder list, elements are displayed in bulleted format. The tag of the order list is <ul>.
11) How copyright symbol can be inserted into a browser page?
Copyright symbol can be inserted into a browser page using © or © in an HTML file.
12) How nested webpage can create in HTML?
Iframe tag is used to create a nested webpage in HTML. In another word, iframe is used to create a webpage within a webpage.
For example -
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>webpage</title>
</head>
<body>
<h2>HTML Iframes example</h2>
<p>Use the height and width attributes to specify the size of the iframe</p>
<iframe src="https://www.teknowize.com/" height="300" width="400"></iframe>
</body>
</html>
13) How to keep HTML list elements straight?
Indents are used to keep HTML element straight.
14) Where can you apply hyperlink?
We can apply hyperlink in text and images both. In HTML ancor tag use to link one page with another page.
<a href="....................">Link Text</a>
15) Style sheet is what?
Style sheet is use to make web pages creative. We use cascading style sheet to designing the web pages.
16) Creating multi-colored text on a web page is possible?
Yes it is possible to use multi-colored text on a webpage.
17) Can we change the color of the bullet?
The color of the bullet depend on the first text color of the list.
18) Describe the layout of the HTML?
Actually, web pages arrange in which manner, that is described in HTML layout.
<header> : It is used to create head of the website.
<nav> : It is used to create navigation bar of the website.
<section> : It is used to create section in a website.
<article> : Using it we can create an independent, self-contained article.
<aside> : Using it we can create content aside from the content ( just like sidebar ).
<footer> : It is used to create footer of the website.
19) which tag we can use to separate a section of texts?
<br> tag - The <br> tag is used to break the line the text.
<p> tag - <p> tag stand for paragraph tag which means, the text written in the form of new paragraph.
20) How to put background image in a web page?
We can put the background image in a webpage by using below code after </head> tag.
<body background="image.gif">
21) Empty element is what in HTML?
The element with no content are known as empty element.
For example - <br> , <hr> etc.
22) Explain the use of span tag in HTML?
Span tag in HTML is used for -
• To add colour on text.
• To add background on the text.
• To highlight any text.
Example -
<p>Welcome to <span style="color:#ffffff">Teknowize</span></p>
23) Explain the use of iframe tag in HTML?
Iframe tag in HTML used to display a web page inside a web page.
Syntax -
<iframe src="URL"> </iframe>
For example -
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>webpage</title>
</head>
<body>
<h2>HTML Iframes example</h2>
<p>Use the height and width attributes to specify the size of the iframe</p>
<iframe src="https://www.teknowize.com/" height="300" width="400"></iframe>
</body>
</html>
HTML5 Interview Questions
Lets learn most important Html5 interview questions.
24) Is <! DOCTYPE html> tag is HTML tag?
No, <!DOCTYPE html> tag is not a HTML tag. It is basically used to give instruction to the web browser about the version of the HTML page.
25) Explain canvas element in HTML5?
The <canvas> element is a container using which we can draw graphic on web page with the help of scripting language (like JavaScript ).
Example -
<canvas id="myCanvas1" width="300" height="100" style="border:2px solid;">
Your browser doesnor support the HTML% canvas tag
</canvas>
26) Explain SVG ?
Using HTML SVG we can describe two dimensional vector and vector graphics / raster graphics.
Example -
<svg width="100" height="100">
<circle cx="50" cy="50" r="40" stroke="yellow" stroke-width="4" fill="red" />
</svg>
27) What new form elements are introduced in HTML5?
• Color
• Date
• Datetime-local
• Time
• Url
• Range
• Telephone
• Number
• Search
28) Is every web browsers support?
Yes, almost every web browser support HTML5
Example - Chrome, opera, Firefox, Internet explorer, Safari etc.
29) HTML5 support which type of video?
• MP4
• WebM
• Ogg
30) HTML5 support which type of audio tag?
• mp3
• WAV
• Ogg
Now see the code, using which mp3 file can be played in HTML.
<audio controls>
<source src="koyal.mp3" type="audio/mpeg">
</audio>
31) Define figure tag in HTML5?
On the web page, we can add photo in the document using figure tag.
<p>The taj mahal is widely recognized as "the jewel of muslim art in India</p>
<figure>
<img src="htmlpages/images/tajmahal.jpg" alt="Taj Mahal" />
</figure>
32) Define figcaption tag in HTML5?
Using <figcaption> element we can provide a caption to an image. It is optional tag which always used before or after the content in <figure> tag.
<figure>
<img src="htmlpages/images/tajmahal.jpg" alt="Taj Mahal" />
<figcaption>Fig.1.1 - A front view of the great taj mahal in agra</figcaption>
</figure>
33) Button tag is what in HTML5?
In HTML5, <button> tag is used to create a clickable button set the <form> tag.
<button name="button" type="button">Click here</button>
34) what is datalist tag in HTML5?
Datalist tag used to provide facility to the user to choose the predefined option to select data.
<label>
Enter your favorite cricket players: press any character<br>
<input type="text" id="favCktplayer" list="Cktplayers">
<datalist id="Cktplayers">
<option value="sachin tendulkar"></option>
<option value="brian Lara"></option>
<option value="Jacques Kallis"></option>
<option value="Rahul Dravid"></option>
</datalist>
</label>
35) Show all the tags which migrate from HTML for HTML5.
HTML4 | HTML5 |
---|---|
<div id="header"> | <header> |
<div id="menu"> | <nav> |
<div id="content"> | <section> |
<div id="post"> | <article> |
<div id="footer"> | <footer> |
36) If we do not put <! DOCTYPE html> then HTML5 work or not?
No, because if we do not put <! DOCTYPE html> then browser unable to identify the HTML document , due to which some HTML5 tag are not function properly.
37) Why 'required' attribute use in HTML5?
The required attribute is used in HTML5 for force the user to fill text in the text field before submitting the form.
<input type="text" name="name" required>
38) Which <input> type are added in HTML5 for form validation?
The input type added in HTML5 for validation is email, url, number, tel and date.
<input type="email" name="email">
<input type="url" name="url">
<input type="number" name="number">
<input type="tel" name="tel">
<input type="date" name="date">
39) How to add HTML auto-complete with one line of code?
You can add HTML autocomplete with the below code.
<input list="citys" type="text" name="city">
<datalist id="citys">
<option value="agra"></option>
<option value="Kolkata"></option>
<option value="Delhi"></option>
<option value="Mumbai"></option>
</datalist>
40) How can page loading time be reduced?
There are many factors which affect the speed of page loading of a website.
Some methods which help to increase page speed are -
• Reduce the size of the image.
• Remove all unnecessary CSS JS file.
• HTTP compression.
• Minimal caching.
• Minimal redirection.
41) If there is no text between text then what happens?
If text does not presents between tags then there is nothing happened but tag which has no closing tag like <image>, <br> then they not required any text.
42) Limit of the text field size are?
The default limit of the text field size are 13 character but if you include attribute of size then you can set the size.
43) Cellspacing and cellpadding is what?
Cell spacing is used to provide a gap or space between each cell. Where cell padding is used to provide a gap or space between text written inside the cell.
44) Difference between HTML and XHTML is what?
45) CSS can be included in HTML in which way?
In HTML there are three ways in which we can include CSS -
• Inline CSS
<p style="color:brown;">Inline CSS</p>
• External CSS
<link rel="stylesheet" href="style.css">
• Internal CSS
<head>
<style>
p{
color:brown;
}
</style>
</head>
46) JavaScript can be included in web page in which way?
In webpage, we can include JavaScript in three way -
• Inline
<button onclick="alert('click the button')">Click me !</button>
• Script block
<button onclick="alert('click the button')">Click me !</button>
• Link to JavaScript file
<button onclick="myFunction()">Click me !</button>
<script>
function myFunction() {
var x = 5;
var y = 6;
var result = x + y;
alert(x + '+' + y + ' is equal to' + result)
}
</script>
47) Explain marquee?
Marquee is used to add auto scrollable text/image on your webpage.
Syntax -
<marquee behavior="scroll" direction=" right"> Welcome to teknowize</marquee>
48) Viewport and how to set it up?
Visible area of a webpage on a browser
changes based on the device size.
syntax -
<meta name="viewport" content="width=device-width, initial-scale=1.0">
49) How to change text color in HTML?
You can change text color in HTML by HTML style attribute.
Syntax -
<tagname style="property:value;">
<p style="color: magenta;">Teknowize </p>
50) How to bold text in HTML?
You can bold text in HTML by using bold tag or strong tag.
Syntax -
<b> </b>
or
<strong> </strong>
<p><b>Welcome to</b> </p>
<p><strong>teknowize</strong></p>
51) How to centre text in HTML?
You can move any text into center using HTML center tag.
Syntax -
<center> </center>
<center>Welcome to teknowize </center>
52) How to comment in HTML?
You can comment HTML source by below syntax
Syntax -
<!-- write your comment here -->
<p>Welcome to teknowize </p>
<!-- This line is commented and not visible on browser -->
53) How to link CSS to HTML?
You can link CSS to HTML using link tag. The link tag always placed inside head tag.
Syntax -
<link rel="stylesheet" type="text/css" href=" file path of your .css file " >
<link rel="stylesheet" type="text/css" href="style.css">