HTML - KodNest

1. What is HTML ?

HTML stands for Hypertext Markup Language. It is s markup language for World Wide Web. HTML was developed by Tim Berners Lee during 1990’s. It consists of tags which are used to define content and web page formatting.

2. What is DOCTYPE ?

DOCTYPE stands for Document Type Declarations. DOCTYPE is used to specify the web browsers that which types of documents(such as SGML or XML Documents) it will receive. <!DOCTYPE> is declared above the <html> tag.

3. What are different version of HTML ?

HTML has many versions since it inceptions during 1990’s. HTML version are HTML, HTML+, HTML 2.0, HTML 3.2, HTML 4.0 and the latest version HTML 5.

4. What is Tag ?

In HTML, a tag tells the browser what to do. When you write an HTML page, you enter tags for many reasons — to change the appearance of text, to show a graphic, or to make a link to another page.

5. What is HTML Element ?

An HTML element is everything from starting to the ending of HTML tags. For example, <p> This is an HTML Element</p>, in this example, from starting tag to ending tag everything is HTML element and “This is an HTML Element” is Element Content.

6. What is HTML Attribute ?

HTML attribute adds additional information to the HTML Elements. For example, <font size=”5” color=”green”>, here size and color are html attributes.

7. How does HTML page look like ?

<html>
<head>
<title>Title of the page</title>
</head>
<body>
Content goes here.
</body>
</html>

8. What is Hyperlinks ?

Hyperlinks are used to navigate to new document with the help of text, image or with group of words.

9. Name some of the Web Browser ?

Some of the most famous web browsers are Google Chrome, Mozilla Firefox, Opera Browser, Safari and Netscape etc.

10. Which is the basic editor in HTML ?

There are many editors for HTML like Notepad, Notepad++, EditPlus and WYSIWYG HTML editors etc.

11. What are web standard ?

Web standards are standards specified for the internet or World Wide Web aspects for improving internet usability by all major OS and browsers.

12. How to open a link in new tab or window ?

To open a link in new tab or window, we have to use the following html code:

<a href=”https://www.kodnest.com” target=”_blank”>Welcome to KodNest!</a>

13. What is formatting in HTML ?

The HTML formatting is a process of format the text for a better look and feel. It uses different tags to make text bold, italicized, underlined. More details.

14. List down some heading HTML contains.

The HTML contains six types of headings which are defined with the <h1> to <h6> tags. Each type of heading tag displays different text size from another. So, <h1> is the largest heading tag and <h6> is the smallest one. For example:

<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>

15. Which HTML tag is used to view data in the tabular form ?

The HTML table tag is used to display data in tabular form (row * column). It also manages the layout of the page, e.g., header section, navigation bar, body content, footer section. Here is the list of tags used while displaying the data in the tabular form:

Tag	Description
<table>	It defines a table
<tr>	It defines a row in a table
<th>	It defines table heading in a table
<td>	It defines table data in a table
<caption>	It defines caption to table
<colgroup>	It defines a group of one or more column in table
<col>	It defines column properties for each column
<tbody>	It is used to group the body content in a table
<thead>	It is used to group the head content in a table
<tfooter>	It is used to group the footer content in a table.

16. 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>

17. How many types CSS can be include in HTML?

There are three ways to include the CSS with HTML:

1. Inline CSS : It is used when only small context is to be styled.

– To use inline styles add the style attribute in the relevant tag.

2. External Style Sheet : Is used when the style is applied to many pages.

– Each page must link to the style sheet using the <link> tag. The <link> tag goes inside the head section:

<head>
<link rel=”stylesheet” type=”text/css” href=”mystyle.css” />
</head>

3. Internal Style Sheet : Is used when a single document has a unique style.

– Internal styles sheet needs to put in the head section of an HTML page, by using the <style> tag, like this:

<head>
<style type=”text/css”>
hr {color:sienna}
p {margin-left:20px}
body {background-image:url(“images/back40.gif”)}
</style>
</head>

18. 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.

19. List down different types of Doctypes.

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">

20. How to upload files using HTML to website ?

The uploading of files requires some necessary configuration like :An HTTP server that acts as a transaction between the user and the server. Access to the directory of cgi-bin that consists of the receiving script.

There are some scripts that are already available. Form for the implementation and the coding of it will be like:

<form method="post" enctype="multipart/form-data" action="up.cgi">

The form that has to be uploaded will be done by the following given code:

<input type=file name=upload><br>

This tag will contain the file name that has to be uploaded on the website.

Any remarks about the file will be written like:

<input type=text name=remark><br>
<input type=submit value=Press> This form will allow user to upload their own file in an easy way.
</form>

21. What are the list types available in HTML ?

The common list type are available in HTML are given below:

– Ordered list

– Unordered list

– Definition list

– Menu list

– Directory list

22. What is HTML blocks ?

HTML blocks can be defined by HTML tags like <span> and <div>.

23. What is the difference between <div> and <span> elements?

<div> tags are used to define section in document block wise whereas <span> tag is used to define section in documents inline.

24. How to change the size of the image ?

HTML image size can be change with the help of attributes as given the below

<a href=”hello.png” alt=”Image” height=”350” width=”200”>

25. 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:

<p>
<span style=”color:#000000;”>
In this page we use span.
</span>
</p>

26. What is use of an iframe tag ?

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

Syntax:

<iframe src="URL"></iframe>

Example:

<iframe src="demo_iframe.html" width="200px" height="200px"></iframe>

Target to a link:

<iframe src="http://www.kodenst.com" name="iframe_a"></iframe>

27. 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.

28. What is Marquee tag ?

The <marquee> is a non-standard HTML tag which was used to create a scrolling text or an image. It was used to make the text/image scroll horizontally across or vertically down the web page.

<!DOCTYPE html>
 <html>
  <head>
    <title>Title of the document</title>
  </head>
  <body>
    <marquee direction=”down”>A scrolling text created with HTML Marquee element.</marquee>
  </body>
</html>

29. What are the frames ?

The <frame> tag defines a specific window, a frame, where we can load another web page. To specify the address of this web page, use the src attribute. There can be several such frames on one web page.

The <frame> tag is used with the <frameset> element, which define how to divide the window into frames.

Example:

<html>
  <head>
    <title>Title of the document</title>
  </head>
  <frameset cols=”50%,50%”>
    <frame src=”hello.html”>
    <frame src=”world.html”>
  </frameset>
</html>

30. What is HTML DOM ?

When a web page is loaded, the browser creates a Document Object Model of the page.

The HTML DOM model is constructed as a tree of Objects:

31. 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>

32. What is FieldSet in HTML ?

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.

33. 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.

34. List down the media types and format in 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
Audio	MIDI, RealAudio, WMA, AAC, WAC, Ogg, MP3, MP4
Video	MPEG,AVI,WMV,QuickTime,RealVideo,Flash,Ogg,WebM,MPEG4 or MP4

35. 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.

36. What is Responsive Web Design ?

Responsive Web Design makes your web page look good and suitable to work on every device and every screen size, no matter how large or small, mobile or desktop.

37. What is HTML 5?

HTML5 is the fifth major revision of the standard that defines Hypertext Markup Language (HTML). One of the design goals for HTML5 is to support for multimedia on mobile devices. Other new features in HTML5 include specific functions for embedding graphics, audio, video, and interactive documents.

38. Difference between HTML and HTML 5.

Basis of Difference	HTML	HTML 5.0
Running of JavaScript	Allows JavaScript to perform only in the interface of the browser. It does not run originally in the background of the browser.	The JavaScript code can run in the browser’s background itself via the JS web worker API.
Support for multimedia tags	Does not allow the inclusion or running of audio <audio> and/or video <video> tags in its programs.	Allows the inclusion and performance of video and audio controls and tags.
Support for visualization linked to shapes	Does not support the drawing of different shapes (triangles, circles, rectangles, etc.) in the older HTML versions.	HTML5 supports the drawing of different shapes (triangles, circles, rectangles, etc.)
Support for vector graphics	Offers support for vector graphics exclusively with programs like Silver-light, Flash and VML.	HTML 5 allows support and usage of virtual vector graphics even without the support of programs of the likes of Silver-light, Flash and VML.
Mobile- friendliness	Older HTML versions provide lesser mobile-friendly features.	HTML5 is a comparatively more mobile-friendly language.
Simplicity of doctype declaration	Doctype declaration is long and complicated in case of HTML. <!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01//EN” “http://www.w3.org/TR/html4/strict.dtd”>	Doctype declaration is comparatively quite simple and easy to understand in HTML 5. <!DOCTYPE html>
Complexity of character encoding	Character encoding is complicated and lengthy in HTML.	Character encoding is very simple and easy to decipher in HTML 5.
Storage of data	Uses cookies for the cause of storing temporary data.	Uses SQL databases and related application cache memory for storing the offline data.
Elimination of elements	Most originally launched elements are present in the older HTML.	Elements of the likes of tt, big, dir, basefont, strike, frame, frameset, noframes, applet, isindex, font, center, acronym, as well as many other deprecated elements have been eliminated completely in HTML 5.
Absence of attributes (sync, charset and ping)	Attributes such as async, charset and ping are not a part of HTML.	Attributes such as async, charset and ping form an important part of HTML 5.
Drag and Drop	HTML disallows drag and drop effects.	HTML5 features drag and drop effects.
Support for new form controls	HTML does not provide any support for newly introduced form controls.	HTML5 supports different new types of form controls such as date and time, range, tel, email, number, url, search, etc.
Presence of new elements	The new elements contained in HTML 5 are absent in HTML.	HTML 5 contains several new elements. These include summary, time, aside, datalist, details, embed, audio, command, data, footer, header, article, wbr, figcaption, figure, mark, meter, nav, hgroup, bdi, canvas, output, progress, rp, keygen, rt, track, video, ruby, section, source, etc.
Presence of new attributes	New attributes like tabindex, id, repeat, etc. are absent for use in HTML.	Tabindex, id, repeat, etc. are certain attributes that are applicable to HTML 5.0 elements.

39. List down new features Introduced in HTML 5.

HTML5 introduces a number of new elements and attributes that help in building an attractive webSite, that we see nowadays.

It supports following new features.

New Semantic Elements – These are like <header>, <footer>, and <section>.

Forms 2.0 – It contains improvements to HTML web forms. It has introduced new attributes for the <input> tag.

Persistent Local Storage – With HTML5, it is possible to achieve this, without resorting to third-party plugins.

WebSocket – It facilitates setting up a bidirectional communication for web applications.

Server-Sent Events(SSE) – These events got introduced in HTML5. The direction of the flow of the execution of these events is from the server to the Web Browser.

Canvas – It supports a two-dimensional drawing surface that is programmable using JavaScript.

Audio & Video – It allows embedding audio or video on the web pages without resorting to third-party plugins.

Geolocation – It facilitates the visitors to share their physical location with the web application.

Microdata – It allows building our personal vocabulary beyond HTML5 and extends our web pages with those custom semantics.

Drag and drop – It supports to Drag and drop the items from one location to another location on the same Web page.

40. What are the various Elements Provided By HTML5 for Media Content ?

HTML provides the support of following elements for representing the media content.

<audio> – It defines the sound content.

<video> – It represents the video content that needs to be attached to a Web page.

<source> – This tag defines the source of video and audio.

<track> – It defines text tracks for video and audio.

41. Describe Form Input Types in HTML 5 ?

HTML5 is the new standard for HTML that provides 13 new input types for forms. Using these new input types, we can create more interactive and easy-to-use web forms. It also provides better data validation, input control, color picker controls and many others.

The new input types for forms provided by HTML5 are as follows.

color – It’s applicable for HTML elements that represent color.

date – It allows the user to select a date.

DateTime – It enables the user to select a date and time (with time zone).

DateTime-local – It allows the user to select a date and time (without time zone).

email – It is applicable for input fields that contain an e-mail address.

month – It permits the user to select a month and year.

number – It is applicable for input fields that accept a numeric value. It allows setting restriction on the data type of the number, this field takes.

range – It is applicable for input fields that accept a value from a range of numbers. It allows setting restriction on the data type of the number, this field takes.

search – It gets used for search fields.

tel – It defines a field for entering a telephone number.

time – It allows the user to select a time.

URL – It is applicable for the input fields that contain a URL address.

week – It allows the user to select a week and a year.

42. How to use JavaScript in WebPage ?

To add interactive capabilities to your page, you’ll need JavaScript here, except already provided with HTML. This is a scripting language that allows you to interact with certain elements of the page, based on user input. With CSS, there are three main ways here:

In line

Specific HTML elements allow you to run a section of JavaScript while performing a specific event. For example, clicking on a button allows the script to run. These events are accessed by attributes and vary based on the events available for each element. The following example shows a warning of a message when the user clicks on it.

<button onclick = “Warning (‘You clicked me!’);”> Click Me! </ button>

A script module

Until the browser document reaches the part of the document, you can define a script package wherever you are. Note that this may be inside the <head> or <body> section of your document.

<Script>
var x = 5;
var y = 6;
var result = x + y;
Warning (“X + Y Equals” + End);
</Script>

Link to the JavaScript file

Again, like CSS, this is the preferred method here. This allows the content of the page to keep users content how they relate to content, and allows them to load the same script on multiple pages. Just like the script module, you can load the JavaScript file from <head> or <body>, but we will load it in the order in which your document is configured.

<script src = “my-code.js”> </ script>

43. What is SVG Element ?

SVG is followed by the XML format; It has scalable vector graphics used to create vector graphics with interactive and animated support.

Resolution is independent of SVG because it does not lose its size or rearrange its quality.

44. How to disable input in HTML 5 ?

<input type="text" value="Raj" disabled>

45. What is header tag in HTML 5 ?

The HTML <header> element represents a group of introductory or navigational aids. The <header> element is usually contain the section’s heading (an <h1>-<h6> element or other elements like a logo, wrapped section’s header, a search form, and so on).

You can’t placed the <header> tag within a <footer>, <address> or another <header> element

46. What is footer tag in HTML 5 ?

The <footer> tag defines a footer for a document or section.

A footer typically contains information about the author of the section, copyright data or links to related documents

47. What is HTML5 <figure> and <figcaption> Elements.

In HTML5 <figure> contain the images and caption grouped together.

Example:

<figure>
  <img src=”demo.jpg” alt=”demo” width=”150″ height=”150″>
  <figcaption>Fig1. – Hello, HTML5</figcaption>
</figure>

The element defines the image, the element defines the image caption(Content)

48. Which elements are no longer supported in HTML 5.

<acronym>
<applet>
<basefont>
<big>
<center>
<dir>
<font>
<frame>
<frameset>
<noframes>
<strike>
<tt>

49. What is onblur and onfocus in HTML 5.

Event attributes

The onblur attribute hits the moment that the element loses focus

The onfocus attribute fires the moment that the element gets focus.

Demo

<input type="text" value="Search" onfocus="if (this.value=='Search') {this.value='';}"  onblur="if (this.value=='') {this.value='Search';}">

50. HTML5 Tag for playing video files.

<video width=”400″ controls>
  <source src=”video_name.mp4″ type=”video/mp4″>
  <source src=”video_name.ogg” type=”video/ogg”>
</video>

51. In which format SVG graphics is defined.

SVG graphics is defined in XML format.

52. What is HTML 5 Graphics ?

In HTML5, there are two types of graphics.

Scalable Vector Graphics (SVG).

The HTML5 <svg> element is a container for SVG graphics. It provides several methods for drawing boxes, paths, text, circles, and graphic images.

SVG is beneficial as nowadays, people are using high-resolution devices (iPads and Monitors), so it becomes impressive as designs, logos, and charts scale according to the requirement, maintaining the picture quality.

SVG is XML based, which means that every element is available within the SVG DOM. It treats every shape as an object. If the user changes the attributes of any SVG object, the browser will automatically re-render the shape.

Canvas.

It is a rectangular area on the HTML page for drawing graphics on the fly, using JavaScript.

The default size of the canvas is 300 PX × 150 PX (width × height).

The HTML tag <canvas> is a container for the Canvas graphics. Canvas gets executed on the pixel by pixel basis.

In Canvas, browser forgets the graphic, after drawing it. If the user tries to modify it, the entire scene needs to be redrawn, including all the objects present in the graphic.

53. Difference between SVG and Canvas.

Canvas is resolution dependent while SVG is not.

Canvas does not provide any support for event handlers while SVG does provide the support for event handlers.

Canvas is suitable for graphic-intensive games while SVG is not suitable for gaming.

Canvas is suitable for small rendering areas while SVG is suitable for large rendering areas like Google maps.

Canvas provides a less interactive animated user interface. Whereas, the interface provided by SVG is very highly interactive.

55. What is the use of Drag and Drop in HTML 5?

Drag and Drop (DnD) is a powerful User Interface concept, which enables the user to copy, reorder and delete any number of items, just with the help of mouse click. To do this, the user has to click and hold the mouse button over an element, drag to the required location, and finally release the button to drop the element there.

With HTML4, developers have to either do complex Javascript programming or use other Javascript frameworks like jQuery to achieve this functionality.

HTML 5 introduced a Drag and Drop (DnD) API that provides the support of all the fundamental DnD operations to the browser. Thus making it easy for the developers to code it.

Latest versions of all the main browsers, like Chrome, Firefox, and Safari, support this DnD API of HTML5.

Drag And Drop Events.

Many events get triggered during various stages of the drag and drop operation. These events are listed below.

dragstart – it gets triggered when the user starts dragging a draggable object.

dragenter – it gets triggered when the user has dragged the draggable element over the target element.

drag – it gets fired when the object is getting dragged.

dragend – it gets fired when the user releases the mouse button after dragging an object.

dragleave – This event gets triggered when the mouse leaves an element while a drag is occurring.

dragover – This event gets fired when the mouse moves over an element while a drag is occurring.

56. What is HTML 5 Web Storage ?

HTML5 Web Storage, also known as DOM Storage is a way to preserve state on either the client or server which makes it much easier to work against the stateless nature of HTTP. It allows the web pages to store the data locally in the user’s browser.

Following are the advantages of HTML5 Web Storage.

It can store 5 to 10 MB data. That is far more than what cookies allow.

HTML5 never transfers Web storage data with any HTTP request. Thus creating less overhead than cookies and in turn, increase the performance of the application.

Apps can work both online and offline.

This API is easy to learn and use.

57. List down different types of Web Storage provided in HTML 5.

There are two types of Web Storage.

1. Session Storage

As its name indicates, it stores data of current session only. The data stored in Session Storage clears on closing the browser.

Following methods are available to access Session Storage.

Use setItem() function to store data in Session Storage

sessionStorage.setItem (‘key’,’value’);

For Example.

sessionStorage.setItem (‘username’,’Raj’)

Use getItem() function to retrieve data from Session Storage

sessionStorage.getItem(‘key’);

For Example.

var username= sessionStorage.getItem(‘username’);

We can only store String in Session Storage. To save the objects in Session, first, convert the object into JSON string and then store this string in Session Storage as in the following.

sessionStorage.setItem (‘object’, JSON.stringify(object));

If JSON string gets stored in Session Storage, then first convert it into an object as follows.

var object=JSON.parse(sessionStorage.getItem(‘object’));

Use removeItem() function to delete a particular key from Session Storage.

sessionStorage.removeItem(‘key’);

2. Local Storage

Local Storage is the second type of HTML Web Storage. It stores data as KEY/VALUE pair.

Following functions are available to access Local Storage.

Use setItem() function to store data in Local Storage

localStorage.setItem (‘key’,’value’);

Use getItem() function to retrieve data from Local Storage

localStorage.getItem(‘key’);

58. Difference between LocalStorage and SessionStorage Objects.

Following are the key differences between localStorage and sessionStorage objects.

The localStorage object stores the data without an expiry date. However, sessionStorage object stores the data for only one session.

In the case of a localStorage object, data will not delete when the browser window closes. However, the data gets deleted, if the browser window closes, in the case of sessionStorage objects.

The data in sessionStorage is accessible only in the current window of the browser. But the data in the localStorage can be shared between multiple windows of the browser.

59. What is Manifest file ?

Manifest file is a simple text file, that tells the browser what to cache and what not to cache.

A Manifest file contains three Sections as

CACHE MANIFEST – HTML5 performs the caching of files listed under this section after they get downloaded for the first time.

NETWORK – Files listed here, always need a connection to the server. The browser can never cache them.

FALLBACK – Files listed here specify the fallback pages, if any page in it is not accessible.

60. What is Audio Tag in HTML 5? What are its Attributes.

This new element allows you to embed audio files in an HTML or XHTML document, without the need for any plug-ins. The Audio tag is a new tag introduced in HTML5. You can use it to play audio sound like .mp3, wav, and .ogg.

Using the <source> tag, we can specify media along with media type and many other attributes. An audio element allows multiple source elements and browser will use the first recognized format.

<!DOCTYPE HTML>
<html>
<body>
<audio controls="controls">
<source src="URL1" type="audio/mp3" />
<source src="URL2" type="audio/wma" />
<source src="URL3" type="audio/x-wav" />
Your browser does not support the audio element.
</audio>
</body>
</html>

The HTML5 audio tag supports following attributes to direct the look and feel and various functionalities of the control.

autoplay

It is a boolean attribute. If, the value is set the audio track starts playing automatically. The System will not wait for data loading to complete.

autobuffer

It is a boolean attribute. If set, the audio will automatically begin buffering, even if the automatic play is not enabled.

controls

If this attribute is present, it will allow the user to control audio playback, including volume, seeking, and pause/resume playback.

loop

Setting this boolean attribute would automatically restart the audio from the beginning, once it reaches to the end.

preload

This attribute specifies that the audio will be loaded at page load, and will be ready to run. If autoplay is present, this attribute will not work.

src

It represents the URL of the audio to embed. Its presence is optional.

61. Name 5 common block-level and inline HTML elements.

block elements <h1>, <p>, <ul>, <ol>, <li> inline elements <span>, <a>, <strong>, <i>, <img>

62. What is the use of data-attribute ?

It allow you to store extra information/ data in the DOM. u can write valid html with embedded private data. You can easily access data attribute by using javascript and hence a lot of libraries like knockout uses it.

<div id="myDiv" data-user="jsDude" data-list-size="5" data-maxage="180"></div>

63. How can you generate public key in html ?

Html has a keygen element that facilitate generation of key and submission via a form.

<keygen name="name" challenge="challenge string" keytype="type" keyparams="pqg-params">

64. How can you change direction of html text ?

<p><bdo dir="rtl">This text will go right to left.</bdo></p>

65. Can you apply css rule to a part of html document ?

Yes. by using “scopped” in the style tag.

66. When should you use section, div or article ?

<section>, group of content inside is related to a single theme, and should appear as an entry in an outline of the page. It’s a chunk of related content, like a subsection of a long article, a major part of the page (eg the news section on the homepage), or a page in a webapp’s tabbed interface. A section normally has a heading (title) and maybe a footer too.

<article>, represents a complete, or self-contained, composition in a document, page, application, or site and that is, in principle, independently distributable or reusable, e.g. in syndication. This could be a forum post, a magazine or newspaper article, a blog entry, a user-submitted comment, an interactive widget or gadget, or any other independent item of content.

<div>, on the other hand, does not convey any meaning, aside from any found in its class, lang and title attributes.

67. Describe the difference between a cookie, sessionStorage and localStorage.

	Cookie	LocalStorage	SessionStorage
Initiator	Client or server. Server can use Set-Cookie header	Client	Client
Expiry	Manually set	Forever	On tab close
Persistent across browser sessions	Depends on whether expiration is set	Yes	No
Sent to server with every HTTP request	Cookies are automatically being sent via Cookie header	No	No
Capacity (per domain)	4kb	5MB	5MB
Accessibility	Any window	Any window	Same tab

68. What is Critical Rendering Path ?

Constructing the DOM Tree
Constructing the CSSOM Tree
Running JavaScript – parser blocking resource
Creating the Render Tree
Generating the Layout
Painting

1. What is HTML ?

2. What is DOCTYPE ?

3. What are different version of HTML ?

4. What is Tag ?

5. What is HTML Element ?

6. What is HTML Attribute ?

7. How does HTML page look like ?

8. What is Hyperlinks ?

9. Name some of the Web Browser ?

10. Which is the basic editor in HTML ?

11. What are web standard ?

12. How to open a link in new tab or window ?

13. What is formatting in HTML ?

14. List down some heading HTML contains.

15. Which HTML tag is used to view data in the tabular form ?

16. Explain cell padding and cell spacing.

17. How many types CSS can be include in HTML?

18. What are logical and physical tags in HTML?

19. List down different types of Doctypes.

20. How to upload files using HTML to website ?

21. What are the list types available in HTML ?

22. What is HTML blocks ?

23. What is the difference between <div> and <span> elements?

24. How to change the size of the image ?

25. What is the use of a span tag ? Give one Example.

26. What is use of an iframe tag ?

27. What is a better way to design the layout of a web page – a table tag or div?

28. What is Marquee tag ?

29. What are the frames ?

30. What is HTML DOM ?

31. What is Semantic HTML ?

32. What is FieldSet in HTML ?

33. What is a nest in HTML ?

34. List down the media types and format in HTML.

35. What is the XHTML ?

36. What is Responsive Web Design ?

37. What is HTML 5?

38. Difference between HTML and HTML 5.

39. List down new features Introduced in HTML 5.

40. What are the various Elements Provided By HTML5 for Media Content ?

41. Describe Form Input Types in HTML 5 ?

42. How to use JavaScript in WebPage ?

43. What is SVG Element ?

44. How to disable input in HTML 5 ?

45. What is header tag in HTML 5 ?

46. What is footer tag in HTML 5 ?

47. What is HTML5 <figure> and <figcaption> Elements.

48. Which elements are no longer supported in HTML 5.

49. What is onblur and onfocus in HTML 5.

50. HTML5 Tag for playing video files.

51. In which format SVG graphics is defined.

52. What is HTML 5 Graphics ?

53. Difference between SVG and Canvas.

55. What is the use of Drag and Drop in HTML 5?

56. What is HTML 5 Web Storage ?

57. List down different types of Web Storage provided in HTML 5.

58. Difference between LocalStorage and SessionStorage Objects.

59. What is Manifest file ?

60. What is Audio Tag in HTML 5? What are its Attributes.

61. Name 5 common block-level and inline HTML elements.

62. What is the use of data-attribute ?

63. How can you generate public key in html ?

64. How can you change direction of html text ?

65. Can you apply css rule to a part of html document ?

66. When should you use section, div or article ?

67. Describe the difference between a cookie, sessionStorage and localStorage.

68. What is Critical Rendering Path ?

Related Articles

Responses