INTERVIEW QUESTIONS » IMPORTANT html interview questions and answers for freshers

IMPORTANT html interview questions and answers for freshers

i)HTML is stands for Hyper-Text Mark-up Language
ii)A mark-up language is a set of markup tags
iii)HTML documents are described by HTML tags

i) HTML

ii) HTML 2.0

iii) HTML 3.2

iv) HTML 4.01
v) XHTML
vi) HTML5

W3C is stands for a World Wide Web Consortium.
The international body that governs Internet standards.

A tag tells the browser what to do with the data.
html, body, title, a, ol and b are the most commons tags used in HTML.

HTML code:

<HTML>
<HEAD>
<TITLE> This is my page</TITLE>
</HEAD>
<BODY>
This is my output!!!!
</BODY>
</HTML>
Browser Display: This is my output!!!!

i) font-style
ii) font-variant
iii) font-weight
iv) font-size/line-height
v) font-family
vi) caption
vii) icon
viii) menu
ix) message-box
x) small-caption
xi) status-bar

There are many editors for HTML like
1. Notepad,
2. Notepad++,

3. Edit-Plus, and
4. WYSIWYG HTML editors etc.

In HTML, title or subtitle can be given from heading tags. So the size of the text depends on heading tag.
Eg: <h1>Heading 1</h1><br>
<h2>Heading 2</h2><br>
<h3>Heading 3</h3><br>
<h4>Heading 4</h4><br>
<h5>Heading 5</h5><br>
<h6>Heading 6</h6>

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5

Heading 6

WWW stands for World Wide Web.
It is the inter-connection of all the links called as internet.

Tags like <i>, <b>, <strong> etc.
can be used to format HTML. Below is the example given for the same –
1.<b>Test Content</b>,
2.<i>Test Content</i>,and
3.<strong>Test Content</strong>.

<br> tags are line breakers.
Whenever there is a requirement of putting single line breaker then this tag is used.

HTML supports both .htm and .html extension.

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

HTML forms takes data and sends the information to the servers.
Simple HTML form is given:
<form>
Your Name <input type=”text” name=”name”><br>
Your College Name <input type=”text” name=”college”>
</form>

To insert the copyright symbol, you need to type © or & #169; in an HTML file.

We use Radio Buttons when we want that user select one of a limited number of choices.
Example:
<form>
<input type=”radio” name=”Gender” value=”male”> Male
<input type=”radio” name=”Gender” value=”female”> Female </form>

<link rel=”stylesheet” href=”your CSS file path”/>

A hypertext link is a special tag that links one page to another page or resource.
If you click the link, the browser jumps to the link’s destination.

<a href=”My URL “>…</a>

Every HTML elements should begin with this declaration of DOCTYPE.
This is used to specify the version of HTML used in the given document.
<!DOCTYPE html>

Below is the example of adding image in webpage –
<body background = “yourtestimage.gif”>

We can set height and width attributes in image tag –
<img src=”image url” height=”200px” width=”300px” alt=”sample text”/>

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

<div> is like a container and it is like having <br> (line break) tag before and after the block.
<span> is a inline and it is used for small HTML like paragraph.

The body element defines the documents’ body.
It contains all the contents of the document (like text, images, colors, graphics, etc.).

HTML elements with no content are called empty elements.
For eg: <br>

HTML Table tag is make a table in the form of row and column.
It is arranged layout of page like header, body, and footer section etc.

Syntax used:
<table>…</table>

Tags Description
<tr> It defines a row in a table.
<td> It define a cell in table
<table> To show a table.
<caption> It define the table caption.
<colgroup> It is perfer for one or more columns in a table for formatting.
<thead> It is used to header in the table.
<tfooter> It is used to footer in a table.

It consists of :
1. Character-based data types
2. Several key components, including elements (and their attributes)
3. Character references and entity references.
4. Also the document type declaration.

I have display the list of some tags that we used in HTML table.
These tags are:
<table>——— This is started tag of table.All other table tags works inside this tag.
<th> ———– This is used to write header on table.
<tr> ———– This is used to create row on table.
<td> ———– This is used to create table cells.
<caption>—— This is specifies the table caption.
<colgroup>—–Specifies the group of columns in table.
<col> ———- Using then we can set the attribute value for one or more columns in table.
<thead>——– This is used to set table head.
<tbody>——– This is used to set table body.
<tfoot>——— This is used to set table border

In HTML we use <br /> to break the line without started any new paragraph.

Syntax:
<br />
In HTML <br /> has no end tag.

Example:

<p>Hello<br />client<br /> Welcomes You!</p>

Output:
Hello
client
Welcomes-You!

For creating horizontal line we use <hr /> in HTML.

Syntax:
<hr />

Example:
<p>This is upper level</p>
<hr />
<p>This is middle level</p>
<hr />
<p>This is bottom level</p>
Both <br /> and <hr /> called as empty tags. Because their is no end tag for them.

<table>
<tr>
<td>50 pcs</td>
<td>100</td>
<td>500</td>
</tr>
<tr>
<td>10 pcs</td>
<td>5</td>
<td>50</td>
</tr>
</table>

To create a dropdown list box in HTML, write following code
<select name=”drop1″ id=”drop1″>
<option value=”1″>item 1</option>
<option value=”2″>item 2</option>
<option value=”0″>All</option>
</select>

To create a list box, write following code
<select name=”drop1″ id=”Select1″ size=”4″ multiple=”multiple”>
<option value=”1″>item 1</option>
<option value=”2″>item 2</option>
<option value=”3″>item 3</option>
<option value=”4″>item 4</option>
<option value=”0″>All</option>
</select>

There are two ways to stop a worker: by calling worker.terminate() from the main page (e.g: .html,.aspx,.php page etc) or by calling self.close() inside of the worker itself(e.g: .js page).

Web worker don’t access following things:
1.The DOM (it’s not thread-safe)
2.The window object (few read-only exception (e.g: location object
3.Host Page (The parent object)

HTML has no mechanism to control this. However, with CSS, you can set the margin-bottom of the form to 0.

For example:
<form style=”margin-bottom: 0;” action=…>
You can also use a CSS style sheet to affect all the forms on a page:
form {margin-bottom: 0 ; }

DHTML is called as Dynamic HTML.
DHTML is a combination of HTML and client side scripting languages like Java-script, CSS etc.
Good example for this would be navigation menu in web page.

This is used to increase the interactive ability and the visual effect of the web pages which is loaded in the browser. The main technologies that are used in DHTML are namely:
* HTML
* JavaScript
* CSS which is also called as Cascading Style Sheet
* DOM also called as Document Object Model

1). Width = “100” takes only 100px whereas width = “100%” takes entire available space.

2). Width = “100” Browser consider this as 100px and the object uses only 100px space.
3). Width = “100%” Browser consider this as 100% and the object uses available space completely.

XML is used for exchanging data, HTML is used to displaying the data in browser.

XHTML will follow XML rules.
So it means it is a case sensitive.
HTML pages can be changed to XHTML.
So during this process we have to find the images, line breaks etc.,to include the closing tags.
XHTML is compatible with XML.

If you are using <table> tag, then “align” attribute can be used to align the table to right/left.
Below is the sample to align the table to right/left.
<table align=”right”>
<table align=”left”>

Below is the example to show it –
<div style=”margin-left: auto; margin-right: auto;”>
<table>…</table>
</div>

Below is the syntax of <form> in HTML form –
<form action=”[URL]”>
When form is submitted then form data has been sent to URL, which is specified in the URL attribute.
URL is referred to server side program.

i. Word Spacing–defines an additional amount of space between words
ii. Letter Spacing–defines an additional amount of space between characters.
iii. Text Decoration–allows text to be decorated through one of five properties:
1.underline,
2.overline,
3.line-through,
4.blink,
5.or the default, none.
iv. Vertical Alignment–may be used to alter the vertical positioning of an inline element, relative to its parent element or to the element’s line.
v. Text Transformation–allows text to be transformed by one of four properties:
• capitalize (capitalizes first character of each word)
• uppercase (capitalizes all characters of each word)
• lowercase (uses small letters for all characters of each word)
• none (the initial value)
vi. Text Alignment–This property is similar in function to HTML’s ALIGN attribute on paragraphs, headings, and divisions.

Some of the common lists that can be used are:
a) Ordered list
b) Unordered list
c) Definition list
d) Menu list
e) Directory list

In HTML <ul> defined for unordered list. <li> tags will be used along with <ul>.
<ul>
<li>Add</li> <li>Subtract</li>
<li>Divide</li>
</ul>

– <dl> is a definition list tag used in HTML.
– It is used with <dt> and <dd>.
– <dt> list the item while <dd> describes it.

Just use the image as the link content, like this:

<a href=…><img src=… alt=…></a>

An HTML comment begins with “<!–“, ends with “–>”, and does not contain “–” or “>” anywhere in the comment.
The following are examples of HTML comments:
* <!–This is a comment. –>
* <!–This is another comment,and it continues onto a second line. –>
* <!—->

Do not put comments inside tags (i.e., between “<” and “>”) in HTML markup.

Marquee is used to scroll the text across the web page this can be seen mainly in news websites. Have a look at the example given below – <br> <marquee> your text </marquee>.

Tags           Description

<form>     –> It is provide an HTML form for user input
<input>     –> It is provide an input control
<textarea>     –> It is provide a multiline input control (text area)
<button>     –> It is providea clickable button
<select>    –> It is provide a drop-down list
<optgroup>    –> It is provide a group of related options in a drop-down list
<option>    –> It is provide an option in a drop-down list
<label>    –> It is provide a label for an <input> element
<fieldset>    –> Groups related elements in a form
<legend>    –> It is provide a caption for a <fieldset> element

“<fieldset>” tag is used in HTML for grouping the elements in a form.
<form>
<fieldset>
<legend>….</legend>
</fieldset>
</form>

<pre> tag defines the pre-formatted text that is used to display the text with the fixed width and uses a predefined fonts and it keeps both spaces and line breaks separate and show the text as it is.
The code that can be used to display the text that can be written in whatever way the user wants is as follows:
<pre>
Text in a pre-element —-//
is displayed in a fixed-width
font, and it preserves
both spaces and line breaks
</pre>

“get” and “post” methods are used to send data as a part of request to server.

“get” is used to get the resource from server whereas “post” is used to submit the data to server.

By adding script tag in HTML like below –
<html>
<head>
</head>
<body>
<script type=”text/javascript”>
Alert(‘your message to display’);
</script> </body>
</html>

Cell Spacing represents the space between cells and is specified in pixels.
Cell Padding is the space between the cell border and the cell contents and is specified in pixels.

HTML Text Linkis using a HTML tag <a> and it is also called anchor tag. In <a> tag user can click link and reach to linked document on web page either onpage ,next page ,on top,
Syntax used:
<a href=”url”>link text</a>

A HTML Blocks is a standard block used to add text, multimedia, widgets etc to a site front page or course page. The title bar may be left blank if desired.
There are two type of HTML Elements define as given below:
1. Block Elements
2. Inline Elements

Block level elements is used as a start(and end) with a new line and show on web browsers.
Example:
<p>, <h1>,<h2>,<h3>, <h4>,<h5>,<h6>, <ul>,<ol>, <dl>, <pre>,<hr>,<blockquote>, and <address> .

Inline elements are used to displayed without line breaks.
Example:
<b>,<td>,<a>,<img>,<em>,<strong>, <sup>, <sub>, <big>, <small>, <li>, <ins>,<del>,<code>,<cite>, <dfn>,and <kbd>.

We used Text fields when we want that user entered like letters, numbers etc. in a form.

Example:
<form>
<input type=”hidden” name=”fname” value=”1″ />
User name: <input type=”text” name=”username”>
Password: <input type=”password” name=”password”>
</form>

In HTML Email Tag is used HTML <a> tag then we can specify an email address to send with mailto:email address in href attribute .
Syntax used:
<a href= “mailto:abc@example.com”>Send Email</a>

We use Check-boxes When we want that user can select one or more options of a limited number of choices.

Example:

<form>
I have a computer:<input type=”checkbox” name=”electronicdevice” value=”Computer”>
I have a TV: <input type=”checkbox” name=”electronicdevice” value=”TV”>
I have a AC: <input type=”checkbox” name=”electronicdevice” value=”AC”>
</form>

Yes we can have as many nested lists in HTML.
Let us see an example of the same.

Example:

<html> <body>
<h4>Computer Programming Languages:</h4>
<ul>
<li>Low Level Languages
<ul>
<li> Machine language </li>
<li> Assembly language </li>
</ul>
</li>
</ul>
<li>String and List processing
<ul>
<li>LISP</li>
<li>Prolog</li>
</ul>
</li>
<li>Object oriented programming
<ul>
<li>C++</li>
<li>Java</li>
</ul>
</li>
<li>Visual programming
<ul>
<li> Visual C++</li>
<li>Visual Basic</li>
</ul>
</li>
</body>
</html>

HTML5 is the next major revision of the HTML standard superseding HTML 4.01, XHTML 1.0, and XHTML 1.1.

HTML5 is a standard for structuring and presenting content on the World Wide Web.

HTML 5 has the capability to store data locally. Previously it was done with the help of cookies.
Exciting thing about this storage is that its fast as well as secure.
There are two different objects which can be used to store data.
i) Local-Storage: object stores data for a longer period of time even if the browser is closed.
ii) Session-Storage: object stores data for a specific session.

Almost all latest browsers have a support for HTML which includes Chrome, FireFox, IE etc.

1. HTML is simply laying out images and texts in a webpage. After some updates have resulted the support to semantic data.
2. HTML5 is seems to be different from HTML. It tried to be an application platform. It has support for audio, video and interactive 3d videos.

This tag represents the header of a section.

This tag represents a footer for a section and can contain information about the author, copyright information, et cetera.

Tags Description
<datalist>–> It is provide a list of pre-defined options for input controls
<keygen>–> It is provide a key-pair generator field (for forms)
<output>–> It is provide the output

HTML FRAMES works to divide your browser window into multiple section where each section can load a separate HTML document . HTML FRAMES provides how to be make a home page that make a normal HTML documents that should be loaded into each of these frames.
Collection of frames in browser window is known as a frameset and it performed by rows and columns. Html frame is frameset page is loaded the browser automatically loads related pages.
Synatx used:
<frameset>…</frameset>

Applets are small programs that can be embedded within web pages to perform some specific functionality, such as computations, animations, and information processing. Applets are written using the Java language.

No. The <a> tag can accept only a single href attribute, and it can point to only a single web page.

The key differences is that the directory and menu lists do not include attributes for changing the bullet style.

The default color for normal and active links is blue.
Some browsers recognize an active link when the mouse cursor is placed over that link; others recognize active links when the link has the focus.
Those that don’t have a mouse cursor over that link is considered a normal link.

Frames can make navigating a site much easier. If the main links to the site are located in a frame that appears at the top or along the edge of the browser, the content for those links can be displayed in the remainder of the browser window.

The browser sizes the frames relative to the total sum of the values. If the cols attribute is set to 100%, 200%, the browser displays two vertical frames with the second being twice as big as the first.

Image map lets you link to many different web pages using a single image.
You can define Shapes in images that you want to make part of an image mapping.

The HTML 5 <canvas> element is just a container for canvas graphics. It is a rectangular area on an HTML page.
Canvas has methods for drawing boxes, paths, text , circles, and graphic images.

SVG stands for Scalable Vector Graphics.The HTML 5 <svg> element is a container for SVG graphics.It has several methods for drawing boxes,paths,text , circles, and graphic images.

Canvas is used to draws 2D graphics, on the fly with JavaScript while SVG is a language for designing 2D graphics in XML.
Canvas is resolution dependent while SVG is resolution independent.

1. The <canvas> element for 2D drawing
2. The <video> and <audio> elements for media playback
3. local storage support.
4. Added New elements, like <figure>,<small>, <header>, <nav>,<article>, <footer>, <section>,<mark>

The <hgroup> tag is used to group heading elements.
The <hgroup> element is used to group a set of <h1> to <h6> elements.
<hgroup>
<h1>Hello</h1>
<h2>How r u?</h2>
</hgroup>

HTML5 is the proposed next standard for HTML 4.01, XHTML 1.0 and DOM Level 2 HTML.
It aims to reduce the need for proprietary plug-in-based rich internet application (RIA) technologies such as Adobe Flash, Microsoft Silverlight, Apache Pivot, and Sun JavaFX.

Like below we can add video in html5
<video width=”320″ height=”240″ controls=”controls”>
<source src=”pcds.mp4″ type=”video/mp4″ />
<source src=”pcds.ogg” type=”video/ogg” />
</video>

And audie like this
<audio controls=”controls”>
<source src=”song.ogg” type=”audio/ogg” />
<source src=”song.mp3″ type=”audio/mpeg” />
</audio>

A typical web page has headers, footers, navigation, central area and side bars. Now if we want to represent the same in HTML 4 with proper names to the HTML section we would probably use a DIV tag.
But in HTML 5 they have made it more clear by creating element names for those sections which makes your HTML more readable.

Below are more details of the HTML 5 elements which form the page structure.
• <header>: Represents header data of HTML.
• <footer>: Footer section of the page.
• <nav>: Navigation elements in the page.
• <article>: Self-contained content.
• <section>: Used inside article to define sections or group content in to sections.
• <aside>: Represent side bar contents of a page.

Datalist element in HTML 5 helps to provide autocomplete feature in a textbox as shown below.
Below is the HTML code for DataList feature:-
Hide Copy Code
<input list=”Country”>
<datalist id=”Country”>
<option value=”India”>
<option value=”Italy”>
<option value=”Iran”>
<option value=”Israel”>
<option value=”Indonesia”>
</datalist>

There are 10 important new form elements introduced in HTML 5:-
1. Color.
2. Date
3. Datetime-local
4. Email
5. Time
6. Url
7. Range
8. Telephone
9. Number
10. Search

Local storage does not have a life time it will stay until either the user clear it from the browser or you remove it using JavaScript code.

HTML5 introduced a new attribute called placeholder. This attribute on <input> and <textarea> elements provides a hint to the user of what can be entered in the field. The placeholder text must not contain carriage returns or line-feeds.

WebSQL is a structured relational database at the client browser side. It’s a local RDBMS inside the browser on which you can fire SQL queries.

No, many people label it as HTML 5 but it’s not part of HTML 5 specification. The specification is based around SQLite.

Semantic HTML is a coding style where the tags embody what the text is meant to convey. In Semantic HTML, tags like <b></b> for bold, and <i></i> for italic should not be used, reason being they just represent formatting, and provide no indication of meaning or structure. The semantically correct thing to do is use <strong></strong> and <em></em>. These tags will have the same bold and italic effects, while demonstrating meaning and structure (emphasis in this case).

IE supports MPEG4 and WebM.

<canvas id=”myCanvas” width=”200″ height=”100″></canvas>