andre/30-seconds-of-code
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Add extractor and builder

Browse Source 
Tested and working
This commit is contained in:
Angelos Chalaris
2019-08-22 14:04:18 +03:00
parent 343f8fd4c7
commit a8818b1998
101 changed files with 18465 additions and 9908 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
snippets/easing-variables.md
View File

@ -6,14 +6,10 @@ tags: animation,intermediate
Variables that can be reused for `transition-timing-function` properties, more
powerful than the built-in `ease`, `ease-in`, `ease-out` and `ease-in-out`.
#### HTML
```html
<div class="easing-variables">Hover</div>
```
#### CSS
```css
:root {
/* Place variables in here to use globally */
@ -56,8 +52,6 @@ powerful than the built-in `ease`, `ease-in`, `ease-out` and `ease-in-out`.
}
```
#### Demo
#### Explanation
The variables are defined globally within the `:root` CSS pseudo-class which matches the root element of a tree representing the document. In HTML, `:root` represents the `<html>` element and is identical to the selector `html`, except that its specificity is higher.