Pure Css Swat Animation Complete Tutorial
Getting to Know CSS
CSS is a complex language that packs quite a bit of power.
It allows us to add layout and design to our pages, and it allows us to share those styles from element to element and page to page. Before we can unlock all of its features, though, there are a few aspects of the language we must fully understand.
First, it’s crucial to know exactly how styles are rendered. Specifically, we’ll need to know how different types of selectors work and how the order of those selectors can affect how our styles are rendered. We’ll also want to understand a few common property values that continually appear within CSS, particularly those that deal with color and length.
Let’s look under the hood of CSS to see exactly what is going on.
Common CSS Property Values
We’ve used a handful of common CSS property values already, such as the keyword color values of
red and green. You may not have thought too much about them; that’s okay. We’re going to take time now to go over some previously used property values as well as to explore some of the more common property values that we’ll soon be using.
Specifically, we’ll look at property values that relate to colors and length measurements.
Colors
All color values within CSS are defined on an sRGB (or standard red, green, and blue) color space. Colors within this space are formed by mixing red, green, and blue color channels together, mirroring the way that televisions and monitors generate all the different colors they display. By mixing different levels of red, green, and blue, we can create millions of colors—and find nearly any color we’d like.
Currently there are four primary ways to represent sRGB colors within CSS: keywords, hexadecimal notation, and RGB and HSL values.
Specificity Points
Specificity points are intentionally hyphenated, as their values are not computed from a base of 10. Class selectors do not hold a point value of 10, and ID selectors do not hold a point value of 100. Instead, these points should be read as
0-1-0 and 1-0-0 respectively. We’ll take a closer look at why these point values are hyphenated shortly, when we combine selectors.What is CC animation?
CSS animation is a method of animating certain HTML elements without having to use processor and memory-hungry JavaScript or Flash. There's no limit to the number or frequency of CSS properties that can be changed. CSS animations are initiated by specifying keyframes for the animation: these keyframes contain the styles that the element will have.
Hello Friends,
Please LIKE our Facebook page for daily updates...
https://www.facebook.com/codemaster0
Subscribe My Channel For latest Animation Project's
https://www.youtube.com/channel/UC_JQ-ellvdaN1_49XVzOwGg
0 Comments