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

Added an example of background gradient with image (#29570)

Browse Source 
Code sample of how to implement a CSS background gradient, provided a screenshot for demo purpose.
This commit is contained in:
Isaac Miti
2019-03-06 04:15:05 +02:00
committed by Christopher McCormack
parent 35162199c6
commit cc49ac0456
1 changed files with 10 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
guide/english/css/background/index.md
View File

@ -116,6 +116,16 @@ A gradient is a transition between two or more colors and can be used via CSS si
The syntax of a gradient background can be quite complex and is often still used with vendor prefixes due to inconsistencies between supported browsers. The syntax of a gradient background can be quite complex and is often still used with vendor prefixes due to inconsistencies between supported browsers.
Below is an example of a background gradient:
![background gradient example image](https://res.cloudinary.com/ikayz/image/upload/v1540563757/gradient.png)
```css
header {
background-image: linear-gradient(to right, #069, #099);
}
```
The [Colorzilla Gradient Editor](http://www.colorzilla.com/gradient-editor/) is a great online tool for generating custom gradients and the associated css markup. The [Colorzilla Gradient Editor](http://www.colorzilla.com/gradient-editor/) is a great online tool for generating custom gradients and the associated css markup.
### Background – The Shorthand Property ### Background – The Shorthand Property