gaspersic/freeCodeCamp
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Added new transition duration (#21427)

Browse Source 
Added new transition

Added transition duration to the code and indention to the code.
This commit is contained in:
Takachou
2018-11-11 06:19:53 +04:00
committed by Huyen Nguyen
parent eb4c305722
commit 2efe0116b5
1 changed files with 14 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
guide/english/css/css-buttons/index.md
View File

@ -92,7 +92,18 @@ button:hover {
![Hoverable Buttons](https://image.ibb.co/hxQnfm/button_hover.png "Hoverable Buttons") ![Hoverable Buttons](https://image.ibb.co/hxQnfm/button_hover.png "Hoverable Buttons")
To determine the speed of the hover effect use the property `transition-duration`. To determine the speed of the hover effect, use the property `transition-duration`.
```
button {
background-color: #f4511e;
transition-duration: 0.4s;
}
button:hover {
background-color: #0E2C5B;
color: #FFF;
}
```
### Disabled Buttons ### Disabled Buttons
@ -121,10 +132,11 @@ To animate a button on click use 'button:active':
background-color: #ff7d1a; background-color: #ff7d1a;
border: none; border: none;
border-radius: 15px; border-radius: 15px;
transition-duration: 0.4s;
} }
.button:hover { .button:hover {
background-color: #ff6d00; background-color: #ff6d00;
} }
.button:active { .button:active {