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

Update format

Browse Source
This commit is contained in:
Angelos Chalaris
2020-04-30 13:21:04 +03:00
parent d9fd2d23c3
commit 2fbd3e0737
55 changed files with 412 additions and 571 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
snippets/easing-variables.md
View File

@ -5,6 +5,9 @@ tags: animation,beginner
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`.
- 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.
```html
<div class="easing-variables">Hover</div>
```
@ -50,8 +53,3 @@ Variables that can be reused for `transition-timing-function` properties, more p
transform: rotate(45deg);
}
```
#### 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.