Interview Questions for HTML Developer, Interview Questions for Web designer

css interview questions answers

Q 1.: Is CSS Case Sensitive?
Ans: CSS is case insensitive in all matters under its control; however, some things, such as the document markup language, are beyond its control. HTML is case insensitive in most respects, Except when it comes to certain attribute values, like the id and class attributes. XHTML, being XML, is always case sensitive.

The trick is that if you write a document using an XML declaration and an XHTML doctype, then the CSS class names will be case sensitive for some browsers.

It is a good idea to avoid naming classes where the only difference is the case,
for example:

div.myclass { ...}
div.myClass { ... }

Q 2.: What is ID Selectors?
Ans: A CSS id selector applies to the one element in the HTML document with the specified ID. Just like the class selector, the id selector is defined in the HTML. But unlike classes, each ID must be unique on the page.

The id selector is then defined with a hash- or pound-sign (#) before the id name.

Q 3.: What is Pseudo-classes?
Ans: CSS pseudo-classes are used to add special effects to some selectors.

A pseudo-class is similar to a class in HTML, but it’s not specified explicitly in the markup. Some pseudo-classes are dynamic—they’re applied as a result of user interaction with the document.
A pseudo-class starts with a colon (:). No whitespace may appear between a type selector or universal selector and the colon, nor can whitespace appear after the colon.

a:link {  declarations }
a:visited { declarations }
a:focus { declarations }
a:hover { declarations }
a:active { declarations }

Q 4.: Difference between HTML and XHTML?
Ans: There are very few minor points if we compare them as they are like identical twins. XHTML was actually derived from HTML. The major difference between them is coding in XHTML is comparatively strict than HTML that is if there are some lapses in structure and coding while working in HTML than it could get away easily but that is not a case while working in XHTML. In HTML, there is a liberty to ignore validation of the code. Moreover, tag closing is compulsory in XHTML which is not compulsory in HTML so XHTML closes the tags which were left open by HTML. So we can say that XHTML actually completes HTML.

Also in XHTML, closing of nested tags should be performed in same manner and form in which manner its opening was done. It is also done in HTML but it is not as strict as XHTML. Moreover, tags should be compulsorily used in lowercases in XHTML which is not the case in HTML.

Q 5.: Why we use <doc type=”” /> in HTML and XHTML? What happens if we remove <doc type=”” />
Ans: 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.

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.

If the DOCTYPE or XML declaration is ever removed from your pages, even by mistake, the last instance of the style will be used, regardless of case.
Means inheritance property can not be apply to its tags in regards of CSS. Also due to non standard lots of Scripts will not work properly into your HTML page.

Q 6.: Difference between PADDING and MARGIN?
Ans: 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.

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.

Q 7.: What does !important mean in CSS?
Ans: The !important rule is a way to make your CSS cascade but also have the rules you feel are most crucial always be applied. A rule that has the !important property will always be applied no matter where that rule appears in the CSS document. So if you wanted to make sure that a property always applied, you would add the !important property to the tag. So, to make the paragraph text always red, in the above example, you would write:

p { color: #ff0000 !important; }
p { color: #000000; }

Important CSS also override the all inherited or ID attribute css.

User Style Sheets
However, the !important rule was also put in place to help Web page users cope with style sheets that might make pages difficult for them to use or read. Typically, if a user defines a style sheet to view Web pages with, that style sheet will be over-ruled by the Web page author’s style sheet. But if the user marks a style as !important, that style will overrule the Web page author’s style sheet, even if the author marks their rule as !important.

Q8:  What is Float? Explain its property.
Ans: The CSS float property allows a developer to incorporate table-like columns in an HTML layout without the use of tables. If it were not for the CSS float property,
The purpose of the CSS float property is, generally speaking, to push a block-level element to the left or right, taking it out of the flow in relation to other block elements. This allows naturally-flowing content to wrap around the floated element.

Q 9.:   What are the benefit of CSS3?
Ans: CSS3 a new version of CSS or cascading stylesheet benefits from technical features and properties. From better maintenance, loading speed, and layout design properties CSS3 is much more versatile. Designers get to implement the design elements from CSS3 in a simpler manner.

Few of its advantages are:
Multi column layout
Multiple backgrounds
Text shadow
Border Radius
Box shadow
Media queries

Q10 :  What is Responsive Web design? What we need to do to implement RWD(Responsive Web Design).
Ans: Responsive Web design is the approach that suggests that design and development should respond to the user’s behavior and environment based on screen size, platform and orientation. The practice consists of a mix of flexible grids and layouts, images and an intelligent use of CSS media queries. As the user switches from their laptop to iPad, the website should automatically switch to accommodate for resolution, image size and scripting abilities.

Comments Your Suggestions