Top 20 CSS Interview Question

1. What is the full Meaning of CSS?

The full Meaning of CSS is Cascading Style Sheets. It is a popular style sheets language which is used in web designing. It is a common application in XHTML.

2. Who is the founder of CSS?

The current CEO of Opera Software, Haakon Wium lie, Bert Bos, World Wide Web Consortium (W3C) are known the founder of CSS.

3. What is the origin of CSS?

In 1980s, Standard Generalized Markup Language (SGML) marked the beginning of style sheets.

4. Who maintains the CSS specifications?

World Wide Web Consortium (W3C) maintains the CSS specifications.

5. What are the different version of CSS?

The version for CSS are:

  1. CSS 1
  2. CSS 2
  3. CSS 2.1
  4. CSS 3
  5. CSS 4

6. What are the limitations of CSS?

There are following limitations in CSS:

Not Possible to control Pseudo-class by dynamic behavior

Rules, styles, targeting certain text not possible

Not possible to ascending by selectors

Have limitations of vertical control

No expressions

No column declaration

7. What are the advantages of CSS?

Here are following advantages on CSS:

Easy to page reformatting

Bandwidth

Site wide consistency

Accessibility

Content separated from layout.

8. What is the purpose of pseudo classes and what are they used for?

Pseudo classes can only be applied to block-level elements. It is similar to classes which are used to add special effects to selected HTML tags such as link colors, background-color, margin, hover actions, etc.

Pseudo classes are defined by first mention the selector, followed by a colon and then pseudo-class element. Example:  a:link{ color: blue }, or a:visited { color: red }

Syntax of Pseudo class:

Selector: pseudo class {property: value ;}

Syntax a pseudo class within a CSS class:

Selector. Class: pseudo-class {property: value ;}

Most commonly used pseudo-elements are :hover, :link, :active, :first, :visited, :before. Pseudo classes are used to call a certain action on an element.

9. Can more than one declaration is possible in CSS?

Yes, you can declare multiple style by using a semicolon as a separator.

div.success{ color:#efefef; margin:5px; padding:3px}

10. Explain what does the following elements means in CSS?

div, p ->Selects all elements and all elements div p -> Selects all elements that are anywhere inside a element

div > p -> Selects all elements where parent is a element

div + p -> Selects all elements that are placed immediately after a element

div ~ p -> Selects all elements that are anywhere preceded by a element

11. How can the dimension be defined of an element in CSS?

Here are some properties define dimension:

Width

Height

Max-height

Max-width

Min-height

Min-width

12. How can the gap under the image be removed?

As images is considered inline elements that treat as texts, so we can see there is a gap or space left that can be removed by:

img { display: block ; }

13. How comments can be added in CSS?

The comments in CSS can be added with /* and */.

14. How many ways can a CSS be integrated to a web page?

CSS be integrated in three ways in a web page.

Inline: inline style can be easily done by inserting a ‘style’ attribute inside an HTML element. Though it is not a good practices but effective.

Example: Content Text

Internal or Embedded: It can be done by wrapping custom style in

Linked or External: CSS style is defined in an external .css file and linked to the HTML document with a tag. This can also be done using the ‘@import’.

15. What is grouping in css and why is it used for?

In CSS grouping help you to apply the same style to multiple elements with a single declaration. This can be done by grouping the selectors into a list and separated by commas.

Example:  p, h1, body {font-family: Arial; font-size: 15 ;}

It enhances readability and memory usage.

16. What is an ID selector and what is the function of ID selector?

ID selectors are single identity of a HTML element. ID selectors are used to identify and apply styling to a single specific HTML element. It is defined in the HTML page by inserting an ID selector in the HTML element.

Generally ID selectors are called in the CSS page by ‘#’ sign followed by the name of the ID.

ID selectors must be a unique identity and It can only apply to a single HTML element.

17. What are child selectors?

To group and style a set of elements that are following a parent element that case Child selectors are important. A child selector is called two or more elements, separated by a ‘>’ sign to indicate inheritance.

Example: .intro>p{color: blue;}

18. What are some of the new features and properties in CSS3?

Box model

New Color schemes (RGBA)

Transform property

New Pseudo-classes

Multi-column layout

New Gradients

New Web fonts

Rounded corners

Border Images

Box Shadows, Text Shadows

19. What are the different CSS properties that used to change dimensions?

width: Sets a specific width

  • auto
  • length
  • %
  • inherit

height: Sets a specific height

  •  auto
  • length
  • %
  • inherit

max-height: Sets a maximum height

  • auto
  • length
  • %
  • inherit

max-width: Sets a maximum width

  • auto
  • length
  • %
  • inherit

min-height: Sets a minimum height

  • auto
  • length
  • %
  • inherit

min-width: Sets a minimum width

  • auto
  • length
  • %
  • inherit

20. How is the implementation float property in CSS?

Floats allow an element to place horizontally. Several floating elements can be placed together to make a group type layout.

Floats can accept a left or right value.

div. model {

float: left;

margin: 10px;

}

In CSS3, to prevent subsequent elements from flowing around the floated element, need to pass clear property that followed by the side you wish to disable ('left', 'right', 'both').

author Author: Robert Calixto

comments Commenting and subscribing are very important to us because they motivate us to keep producing content of the highest caliber that appeals to your needs and interests.