1. What is difference between HTML & XHTML?

Ans:

The most important difference between the two markup languages is that HyperText Markup Language,
or HTML, is an application of SGML (Standard Generalized Markup Language), 1 and allows an author to
omit certain tags and use attribute minimization.2 The Extensible HyperText Markup Language, or
XHTML, is an application of XML (Extensible Markup Language). 3 It doesn’t permit the omission of any
tags or the use of attribute minimization. 4 When an XML parser encounters an error relating to the
document’s well-formedness, it must abort, whereas an HTML parser is expected to attempt to recover
and continue.

The Most Important Differences:

 XHTML elements must be properly nested

 XHTML elements must always be closed
 XHTML elements must be in lowercase
 XHTML documents must have one root element

2. What is difference between HTML & XML?

Ans:

 XML- stands for Extensible Markup Language. XML was designed to transport and store data.

 XML was designed to carry data, not to display data

 XML is a markup language much like HTML
 XML tags are not predefined. You must define your own tags
 XML is designed to be self-descriptive
 XML is a W3C Recommendation

HTML- stands for Hypertext Markup Language. HTML was designed to display data.
 HTML is not a programming language, it is a markup language
 A markup language is a set of markup tags
 HTML uses markup tags to describe web pages
 Start and end tags are also called opening tags and closing tags

3. What is CSS?

Ans:

CSS stands for Cascading Style Sheet. Style sheets are simply text files (.css ), composed of lines of
code that tell browsers how to display an HTML page.CSS can format the document content(written in
HTML or other markup language) like layout, colors, fonts. CSS is designed primarily to enable the
separation of the document content and document format. As a result, we can improve content
accessibility, can similarly format two or more documents.

Types of CSS:
  External Style Sheet- You can separate style sheets from HTML documents. Style sheet files
are imported to HTML documents by <link> tag.
 Internal Style Sheet- You can put style sheet rules in the head of the document by <style> tag.
 Inline Style Sheet- The start tags can contain style sheet rules directly in HTML documents by
the style attribute.

Advantages of CSS:

 More Precise Formatting

 Separation of HTML Content from Appearance
 Saves Time
 Easier Site Maintenance
 Web Accessibility

4. What is difference between Paragraph tag (<p>) & <span> tag?

Ans:

 Paragraph <p> tag is a block element.

A block-display element will span the full width of the space available to it, and so will start on a new line
in the flow of HTML. The flow will continue on a new line after the block-display element.

All HTML elements are naturally displayed in one of the following ways:

Block
Takes up the full width available, with a new line before and after (display:block;)
Inline
Takes up only as much width as it needs, and does not force new lines (display:inline;)
Not displayed
Some tags, like <meta /> and <style> are not visible (display:none;)

Example: <p>, <div>, <h1>…<h6>, <ul>, <ol>, <dl>, <li>, <dt>, <dd>. <table>, <pre> , <form> etc.

 <span> tag is a Inline element.

Inline-display elements don’t break the flow. They just fit in with the flow of the document.

Example: <span>, <a>, <strong>, <em>, <img />, <br>, <input> etc.

5. Can we change Block element to Inline & Vice versa?

Ans: Yes. By CSS property ‘Display:Block;’ and ‘Display:Inline;’

6. Explain Positions in CSS?

Ans: There are total 5 types of positions in CSS.

 Absolute- Generates an absolutely positioned element, positioned relative to the first parent
element that has a position other than static. The element's position is specified with the "left",
"top", "right", and "bottom" properties
 Fixed - Generates an absolutely positioned element, positioned relative to the browser window.
The element's position is specified with the "left", "top", "right", and "bottom" properties.
 Relative- Generates a relatively positioned element, positioned relative to its normal position, so
"left:20" adds 20 pixels to the element's LEFT position
 Static - Default. No position, the element occurs in the normal flow (ignores any top, bottom, left,
right, or z-index declarations)
 Inherit - Specifies that the value of the position property should be inherited from the parent
element

7. What is HTML DOM?

Ans: The HTML DOM (Document Object Model) defines a standard way for accessing and
manipulating HTML documents. The DOM presents an HTML document as a tree-structure.

The Document Object Model (DOM) is a cross-platform and language-independent convention for
representing and interacting with objects in HTML, XHTML and XML documents.[1] Aspects of the DOM
(such as its "Elements") may be addressed and manipulated within the syntax of the programming
language in use.

8. What is CSS hacks or filter?

Ans: A CSS filter is a coding technique used to hide or show CSS markup depending on the browser,
version number, or capabilities. Browsers have different interpretations of CSS behavior and different
levels of support for the W3C standards. CSS filters are sometimes used to achieve consistent layout
appearance in multiple browsers that do not have compatible rendering.

Recommended hacks:

conditional comment:
<p><!--[if IE]>
According to the conditional comment this is Internet Explorer<br />
<![endif]-->

<!--[if IE 5]>
According to the conditional comment this is Internet Explorer 5<br />
<![endif]-->

<!--[if IE 5.0]>
According to the conditional comment this is Internet Explorer 5.0<br />
<![endif]-->

<!--[if IE 5.5]>
According to the conditional comment this is Internet Explorer 5.5<br />
<![endif]-->

<!--[if IE 6]>
According to the conditional comment this is Internet Explorer 6<br />
<![endif]-->

<!--[if IE 7]>
According to the conditional comment this is Internet Explorer 7<br />
<![endif]-->

<!--[if gte IE 5]>

According to the conditional comment this is Internet Explorer 5 and up<br />
<![endif]-->

<!--[if lt IE 6]>
According to the conditional comment this is Internet Explorer lower than 6<br />
<![endif]-->

<!--[if lte IE 5.5]>

According to the conditional comment this is Internet Explorer lower or equal to 5.5<br />
<![endif]-->

<!--[if gt IE 6]>
According to the conditional comment this is Internet Explorer greater than 6<br />
<![endif]-->
</p>

Unrecommended hacks:

IE 6 and below
* html {}
IE 7 and below
*:first-child+html {} * html {}
IE 7 only
*:first-child+html {}
 IE 7 and modern browsers only
html>body {}
Modern browsers only (not IE 7)
html>/**/body {}
Recent Opera versions 9 and below
html:first-child {}

9. Write a code for linking CSS?

Ans:

External CSS:
<head>
<link rel="stylesheet" type="text/css" media=”screen” href="(path)/style.css" />
</head>

Internal CSS:
<style type="text/css">……</style>

Inline CSS:
<p style=”color:#00ffff;”>Inline css syntax</p>

10. Explain Float Property?

Ans:

The float property specifies whether or not a box (an element) should float. With CSS float, an element
can be pushed to the left or right, allowing other elements to wrap around it. This allows naturally-flowing
content to wrap around the floated element.

left : The element floats to the left

right: The element floats the right
none: The element is not floated, and will be displayed just where it occurs in the text. This is default
inherit : Specifies that the value of the float property should be inherited from the parent element

Note: 1. Absolutely positioned elements ignores the float property!

2. The value "inherit" is not supported in IE7 and earlier. IE8 requires a !DOCTYPE. IE9 supports "inherit".
3. We can only float block-level elements.

11. What is DTD?

Ans:
The doctype declaration refers to a Document Type Definition (DTD). The DTD specifies the
rules for the markup language, so that the browsers render the content correctly.
The doctype declaration should be the very first thing in an HTML document, before the <html> tag.
 The doctype declaration is not an HTML tag; it is an instruction to the web browser about what version of
the markup language the page is written in.

Types of DTD:

 HTML 4.01 Strict

This DTD contains all HTML elements and attributes, but does NOT INCLUDE presentational or
deprecated elements (like font). Framesets are not allowed.
 HTML 4.01 Transitional
This DTD contains all HTML elements and attributes, INCLUDING presentational and deprecated
elements (like font). Framesets are not allowed.
 HTML 4.01 Frameset
This DTD is equal to HTML 4.01 Transitional, but allows the use of frameset content.

12. What is CSS Specificity?

Ans:
Specificity determines, which CSS rule is applied by browsers. “Specificity is a type of weighting that
has a bearing on how your cascading style sheet (CSS) rules are displayed.”
If two selectors apply to the same element, the one with higher specificity wins.
where both rules have the same specificity 0, 1, 0, 1, the latter rule is always applied.

Selector Specificity Value

*{ } 0
P{ } 1
.class 10
#id 100
Style{ } (inline CSS) 1000

13. What is difference between padding & margin?

Ans:
Padding: Padding is the space inside the border between the border and the actual image or cell
contents. Note that padding goes completely around the contents: there is padding on the top, bottom,
right and left sides. Padding cannot be negative.

Margin: Margins are the spaces outside the border, between the border and the other elements next to
this object. Note that, like the padding, the margin goes completely around the contents: there are
margins on the top, bottom, right, and left sides. Margin can be negative.

14. what is difference between javascript and jquery?

Ans:
JavaScript-

 JavaScript was designed to add interactivity to HTML pages

 JavaScript is a scripting language
 A scripting language is a lightweight programming language
 JavaScript is usually embedded directly into HTML pages
 JavaScript is an interpreted language (means that scripts execute without preliminary
compilation)
 Everyone can use JavaScript without purchasing a license

 JQuery-

JQuery is a JavaScript library that handles many commonly used features and also handles the
differences between, e.g., Internet Explorer and standards-compliant browsers. It's something you can
use to reduce the amount of work when creating web-based applications.

note : Everyone can use JQuery without purchasing a license

note : JQuery made by Java Script