CSS Interview Questions and answers for experienced

CSS Interview Questions and answers for experienced
Here is the list of CSS questions and answers which will help you during interview time.The frequently asked CSS interview questions with answers for beginners and professionals are given below.



css-interview-questions-answers

Question: What are some of the new features and properties in CSS3?

Following are the new features in CSS3 :
* Box model
* New Web fonts
* Rounded corners
* Border Images
* Box Shadows, Text Shadows
* New Color schemes (RGBA)
* Transform property
* New Pseudo-classes
* Multi-column layout
* New Gradients

Question: What is type selector?

Type selector quite simply matches the name of an element type. and add property on it like giving coloring on heading.

h2 {
   color: #999999; 
}

Question: What is universal selector?

Rather than selecting elements of a specific type, the universal selector quite simply matches the name of any element type and define with *

* {
   color: #999999; 
}

Question: What are the different types of CSS?

Below are the different types of CSS –
1. Inline – Adding the CSS to the HTML elements.
2. Embedded – Adding the CSS styles in style attribute.
3. Linked/External – Adding the External CSS file to the HTML document.

Question: List out the components of CSS style?

Below are the different components of CSS styles –
1. Property
2. Selector
3. Value


Question: What is class selector?

You can define style rules based on the class attribute of the elements. All the elements having that class will be formatted according to the defined rule.

.grey {
   color: #999999; 
}

Question: What is ID selector?

You can define style rules based on the id attribute of the elements. All the elements having that id will be formatted according to the defined rule.

#grey {
   color: #999999; 
}

Question: Can you make a class selector particular to an element type?

Here is the example

h2.grey {
   color: #999999; 
}

Question: Can you make a id selector particular to an element type?

Here is the example

h2#grey {
   color: #999999; 
}

Question: What is a child selector?

Here is the example

body > p {
   color: #999999; 
}

Question: Explain type selector in CSS?

Type selector matches the element of specific type. To give the color for all inputs with text types, we can do like this.

input[type="text"]{
 color: #999999;
}

Question: Explain descendant selector in CSS?

Descendant selectors are used when any style to be applied to an element when the element lies inside some element. For example,

ul em {
 color: #999999; 
}



Question: How to use external style sheets?

External style sheets will be used to refer the style information from the external file. see below example

<Head> 
 <link rel=”stylesheet” href="css/style.css" type="text/css"> 
</ Head >

Question: Define Image sprites with context to CSS ?

p[lang] : Selects all paragraph elements with a lang attribute.

Question: Explain descendant selector in CSS?

When a set of images is collaborated into one image, it is known as ‘Image Sprites’. As the loading every image on a webpage consumes time, using image sprites lessens the time taken and gives information quickly. For example,

img.add { width: 60px; height: 55px; background: url (image.god) 0 0; }

Question: Compare Grouping and Nesting in CSS ?

Grouping: Selectors can be grouped having the same values of property and the code be reduced.

 
h1 {
color: green; 
}
 
h2 {
color: green; 
}
 
p {
color: green;
}

Question: Which font names are available on all platforms ?

Only five basic font families( serif, sans-serif, cursive, fantasy, and monsospace) are recognized across platforms, rather than specific fonts.
Specific font name recognitions will vary by browser.

Question: Define float property of CSS?

By float property, the image can be moved to the right or the left along with the text to be wrapped around it. Elements before this property is applied do not change their properties.

Question: How does Z index function?

Overlapping may occur while using CSS for positioning HTML elements. Z index helps in specifying the overlapping element. It is a number which can be positive or negative, the default value being zero.

Question: How can the gap under the image be removed?

As images being inline elements are treated same as texts, so there is a gap left, which can be

img { display: block ; }

Question: How comments can be added in CSS?

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

Question: Is CSS a case-sensitive or case-insensitive?

Descendant selectors are used when any style to be applied to an element when the element lies inside some element. For example,

ul em {
 color: #999999; 
}

Question: Explain descendant selector in CSS?

YES.!! CSS is case insensitive.

Question: Which property will be used for changing the face of font in CSS?

By using “font family” property can be used for changing the face of font.

Question: Mention the property name which is used for making the font oblique in CSS?

By using “font-style” property can be used for making the font oblique.