Top 10 Css3 interview Questions And Answers

Real Time Css3 Interview Questions with Answers PDF

1. What is the difference between CSS and CSS3?
CSS3 is upgraded version of CSS with new future like Selectors, Box Model, Backgrounds and Borders, Text Effects,2D/3D Transformations, Animations, Multiple Column Layout, User Interface etc.

2. List out CSS3 modules?
Below is list of most important CSS3 modules are
•    Selectors
•    Box Model
•    Backgrounds and Borders
•    Text Effects
•    2D/3D Transformations
•    Animations
•    Multiple Column Layout
•    User Interface

3. What is the CSS3 animation?
When the animation is created in the @keyframe, bind it to a selector, otherwise, the animation will have no effect.
Bind the animation to a selector by specifying at least these two CSS3 animation properties:
•    Specify the name of the animation
•    Specify the duration of the animation

4. Explain How flexibility is achieved more in CSS3?Flexibility achieved is in the greater ratio in CSS3 because of the feature of handling multiple style sheets in CSS3 and because of the modularized approach of CSS3.

5. Explain What are the values that can be taken by property white-space of CSS3?
The five values that can be taken by property white-space of CSS3 are
•    Normal
•    pre
•    nowrap
•    pre-wrap
•    pre-line

6. What are the possible values of the “Position” attributes?
The possible value of the “Position” attributes are
•    absolute
•    fixed
•    inherit
•    relative
•    static

7. What is the word wrap/word wrapping in CSS3?
word wrap/word wrapping is used to allow long words to be able to break and wrap onto the next line in css3 we used word-wrap property like below class
.wrapWord{word-wrap:break-word;}

8. What is CSS3 Flexbox?
Flexible boxes, or flexbox, is a new layout mode in CSS3. Flexbox consists of flex containers and flex items.
A flex container is declared by setting the display property of an element to either flex (rendered as a block) or inline-flex (rendered as inline).Inside a flex container, there are one or more flex items.

9. What are CSS3 Transitions?
CSS3 transitions allow you to change property values smoothly (from one value to another), over a given duration.
div {
    -webkit-transition: width 2s, height 4s; /* Safari */
     transition: width 2s, height 4s;
}

10. What is the syntax of opacity in CSS3?
style="opacity:0.4;filter:alpha(opacity=40)"
Firefox uses the property opacity:x for transparency, while IE uses

11. List some advantages to CSS3 animations over script-based animation?
Advantages of using CSS3 animations over script-based animation techniques are as follows:
1.    Easy to use and anybody can create them without the knowledge of JavaScript.
2.    Executes well even under reasonable system load. As simple animations perform poorly in JavaScript, the rendering engine uses the frame-skipping techniques to allow smooth flow of animation.
3.    Allows the browser to control the animation sequence, optimize performance and efficiency by reducing the update frequency of
animations executing in tabs that aren’t currently visible.

Latest Css3 Interview Questions for freshers and Experienced pdf