HTML 5 Interview Questions and Answers (188) - Page 3

What is the difference between Canvas and SVG?

What is the difference between Canvas and SVG?

Canvas and SVG both to be considered as multimedia tags in HTML 5.

<canvas> is a simply a rectangular area built with JavaScript functions. The JavaScript API is used to draw vector graphics into a bitmap of a specific size like a paint program. These are pixel-oriented. That means, we cannot change shapes except by overwriting them with other pixels.

SVG stands for Scalable Vector Graphics. <svg> on other hand is a continer for other tags describes the shapes itself. The SVG is used to draw scalable vector graphics in a document format using XML . The drawing is specified as drawing instructions for each shape and any shape can be changed. These drawings are shape-oriented.
What is the purpose of Web Workers API?

If we need to execute a JavaScript file asynchronously and autonomously, we need to take help of Web Workers API. It is a thread that executes a java-script file.It helps to achieve multi threading in web application.

e.g. var worker = new Worker("http://xyz.com/somejsfile.js");


The above code will execute the somejsfile.js - javascript file that has been passed inside the Worker() method.
What is the purpose of HTML5's Article tag?

It is used to semantically mark the main content section or sections of a page.

An HTML5 page may contain multiple individual parts of main content. For instance, a blog website may contain a page with multiple blog posts in. In that case, each blog post would be enclosed in its own article element.

e.g.

<html>

<body>
<header>
Company Logo
<nav>
<a href="MainPage1.html">Page 1</a>
<a href="Main2.html">Page 2</a>
</nav>
</header>

<nav>
<a href="Subpage1.html">SubPage 1</a>
<a href="Subpage2.html">SubPage 2</a>
</nav>

<article>
<p>Main content section 1</p>
</article>

<article>
<p>Main content section 2</p>
</article>

<footer></footer>

</body>
</html>

What is an iframe in HTML?

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

<iframe src="http://www.dotnetfunda.com">
<p>Your browser does not support iframes.</p>
</iframe>

Some old browsers do not support iframe. In that case, text between the opening <iframe> and closing </iframe> tag will be displayed.
What is a <frameset> tag?

The <frameset> tag defines a frameset.

The <frameset> element holds one or more <frame> elements. Each <frame> element can hold a separate document.

The <frameset> element specifies how many columns or rows there will be in the frameset, and how much percentage/pixels of space will occupy each of them.

Example:
<frameset cols="25%,*,25%">

<frame src="frame1.htm" />
<frame src="frame2.htm" />
<frame src="frame3.htm" />
</frameset>

What is a <dl> tag in HTML?

<dl> is a definition list tag used in conjunction with
1. <dt> tag ---> defines an item in the list
2. <dd> tag ---> describes an item in the list.

<dl>
<dt>Television</dt>
<dd>- An entertainment media with audio and video </dd>
<dt>Radio</dt>
<dd>-An entertainment media with audio alone</dd>
</dl>
What is a <fieldset>tag?

The <fieldset> tag is used to group related elements in a form.
The <fieldset> tag draws a box around the related elements.

Example:
<form>

<fieldset>
<legend>Employee Information:</legend>
Emp Name: <input type="text" /><br />
Email: <input type="text" /><br />
Date of Joining: <input type="text" />
</fieldset>
</form>

Is it possible to specify a link without underlining using HTML?

Yes, it is possible. Let us see an example..
<html>

<body>
<a href="http://www.dotnetfunda.com" style="text-decoration:none;">Visit W3Schools.com!</a>
</body>
</html>


Text-decoration: none style is used not to underline a anchor element.
How can an abbreviation be specified in HTML?

The <abbr> tag is used to provide abbreviation. The title attribute is used in the <abbr> tag, to show the full version of the abbreviation when you mouse over it.

Example:
<p>The <abbr title="DotNetFunda">DNF</abbr></p>
When you place mouse over DNF it displays "Dot Net Funda".
How can you specify an acronym in HTML?

The <acronym> tag defines an acronym. By marking up acronyms you can give useful information to browsers, spell checkers, translation systems and search-engine indexers.
The title attribute is used to show the full version of the acronym when you mouse over it.

Example:
<p>Can I get this <acronym title="as soon as possible">ASAP</acronym>?</p>

How to insert horizontal lines in HTML?

The <hr> tag is used to insert a horizntal line.

Example: <html>
<body>

<p>The hr tag defines a horizontal rule:</p>
<hr />
<p>This is a paragraph 1</p>
<hr />
<p>This is a paragraph 2</p>
<hr />
<p>This is a paragraph 3</p>
</body>
</html>

How to mark deleted text and inserted text?

<ins> and <del> tags are used to mark the inserted and deleted text respectively.
The browsers will strikethrough deleted text and underline inserted text.

Example:
<html>

<body>
<p>My favorite color is <del>blue</del> <ins>red</ins>!</p>
</body>
</html>

How to link an external css file to HTML?

The <link> tag is used to link an external file and the type attribute should be set to "text/css" to refer a style sheet.

Example:
<html>

<head>
<link rel="stylesheet" type="text/css" href="styles.css" />
</head>
</body>
</html>

How to open a link in a new window in HTML?

If you set the target attribute to "_blank" in the <a> tag, the link will open in a new browser window/tab.

Example:
<html>

<body>

<a href="http://www.dotnetfunda.com" target="_blank">Visit DotnetFunda.com!</a>

</body>
</html>

How to jump another part of the document in the same page?

href and name attribute in the <a> anchor tag is used to jump to another part of the document.

Example:
<html>
<body>

<p>
<a href="#C4">Bottom</a>
</p>

<h2>Chapter 1</h2>
<p>This is chapter 1</p>

<h2>Chapter 2</h2>
<p>This is chapter 2</p>

<h2>Chapter 3</h2>
<p>This is chapter 3</p>

<h2><a name="C4">Top</a></h2>
<p>This is chapter 4</p>

</body>
</html>
How to link to a mail message in HTML?

The <a> anchor tag with href with the value as specifed is used to link to a mail message only if the mail is installed in the machine.
Spaces between words for the subject should be replaced by %20 to ensure that the browser will display the text properly

Example:
<html>

<body>
<p>
<a href="mailto:someone@dotnetfunda.com?Subject=Test%20mail">
Send Mail</a>
</p>
</body>
</html>

How can you create a table with vertical table headers?

In each row provide the first column tag as <th> and refer the example below.

Example:
<html>

<body>
<h4>Vertical headers:</h4>
<table border="1">
<tr>
<th>First Name:</th>
<td>Charles Babbage</td>
</tr>
<tr>
<th>Telephone 1:</th>
<td>555 52 896</td>
</tr>
<tr>
<th>Telephone 2:</th>
<td>555 74 563</td>
</tr>
</table>

</body>
</html>

How can you provide heading to a table?

The <caption> tag inside the <table. tag is used to provide caption to the table.

Example:
<html>

<body>

<table border="1">
<caption>Monthly Savings</caption>
<tr>
<th>Month</th>
<th>Savings</th>
</tr>
<tr>
<td>August</td>
<td>1000</td>
</tr>
<tr>
<td>September</td>
<td>500</td>
</tr>
</table>

</body>
</html>

How to have a table cell that spans two columns in HTML?

The <colspan> tag inside a <th> or <td> tag is used to span the columns.
Let us see an example.

Example:
<html>

<body>

<h4>Cell that spans two columns:</h4>
<table border="1">
<tr>
<th>Name</th>
<th colspan="2">Telephone</th>
</tr>
<tr>
<td>Charles Babbage</td>
<td>555 89 123</td>
<td>555 98 321</td>
</tr>
</table>
</body>
</html>

How to have a table cell that spans two rows in HTML?

The <rowspan> tag is used to span two rows.

Example:
<html>

<body>
<h4>Cell that spans two rows:</h4>
<table border="1">
<tr>
<th>First Name:</th>
<td>Charles Babbage</td>
</tr>
<tr>
<th rowspan="2">Telephone:</th>
<td>555 82 982</td>
</tr>
<tr>
<td>555 86 986</td>
</tr>
</table>

</body>
</html>

Found this useful, bookmark this page to the blog or social networking websites. Page copy protected against web site content infringement by Copyscape

 Interview Questions and Answers Categories