1#show_bg_2 {
2
3background-image:
4 /*two color gradient over an image*/
5linear-gradient(to bottom, rgba(245, 246, 252, 0.52),
6rgba(117, 19, 93, 0.73)),url('images/background.jpg');
7
8width: 80%;
9height: 400px;
10background-size: cover;
11}
1.yourElementClass{
2 background: linear-gradient(to top, #fff000 0%, #000fff 100%);
3 /* 1st property: from where the 100% starts */
4 /* 2nd property: the first color */
5 /* 3rd property: the second color */
6 /* to add some colors to the gradient, do the same thing of 2nd and 3rd properties, edit the color and the color-stop */
7}
1body
2{
3 width: 100%;
4 height: 100vh;
5 color: #fff;
6 background-image: linear-gradient(180deg, #581845, #900C3F, #C70039, #FF5733, #FFC300);
7}
8
9/* If scrollbars are appearing you can disable them by just typing*/
10
11::-webkit-scrollbar
12{
13 display: none;
14}
1
2 background: #ada996; /* fallback for old browsers */
3 background: -webkit-linear-gradient(to left, #ada996, #f2f2f2, #dbdbdb, #eaeaea); /* Chrome 10-25, Safari 5.1-6 */
4 background: linear-gradient(to left, #ada996, #f2f2f2, #dbdbdb, #eaeaea); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
5