CSS for styling website
css transation
- 1) What are the advantages of using translate() instead of absolute position?Translate() does not cause the browser to trigger repaint and layout and instead only acts on the compositor. The absolute position triggers the repaint or DOM reflow. So, translate() gives the better performance.
- 2) Does style1.css have to be downloaded and parsed before style2.css can be fetched?
- 3) How to determine if the browser supports a certain feature?The @support in CSS can be very useful to scan if the current browser has support for a certain feature. @supports (display: grid) { div { display: grid; } }
- 4) 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; }
- 5) 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
- 6) 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 the rendering engine uses frame-skipping techniques to allow the smooth flow of the 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.
4iv>