Group Toolbar Menu

Forums » CSS Help » I'm confused

This group has been archived by its founder. It may still be viewed, but can no longer be joined or posted to.

I've been looking all over the site, and I'm not exactly sure if I can or cannot do this. With CSS can we do gradients for backgrounds?
I have 0 experience with CSS, but I would think you'd just make your gradient as a image, then use the image for the background. I don't think it is possible to straight up make a gradient as a full background. Perhaps for small boxes and so forth.


Edit: Refer to this? https://learn.shayhowe.com/html-css/setting-backgrounds-and-gradients/
Yes! You can do gradient!

You can do it like they suggested but you can also use
Code:
background: -webkit-linear-gradient(top, #1e5799 0%,#2989d8 50%,#207cca 51%,#7db9e8 100%);

http://www.colorzilla.com/gradient-editor/ is a handy generator :D
Green wrote:
Yes! You can do gradient!

You can do it like they suggested but you can also use
Code:
background: -webkit-linear-gradient(top, #1e5799 0%,#2989d8 50%,#207cca 51%,#7db9e8 100%);

http://www.colorzilla.com/gradient-editor/ is a handy generator :D

Neat!
OMG Thank you so much. I love gradient backgrounds and it's something that worked on RPG so I wanted to be sure I could do the same thing here. What a relief! And that linked site is literally my very favorite Gradient maker.
Just to test this a bit, is this too long? Does it matter how long the code is?

background: -webkit-linear-gradient(background: rgb(0,61,2);
background: -moz-linear-gradient(45deg, rgba(0,61,2,1) 3%, rgba(0,145,21,1) 26%, rgba(0,84,5,1) 90%);
background: -webkit-linear-gradient(45deg, rgba(0,61,2,1) 3%,rgba(0,145,21,1) 26%,rgba(0,84,5,1) 90%);
background: linear-gradient(45deg, rgba(0,61,2,1) 3%,rgba(0,145,21,1) 26%,rgba(0,84,5,1) 90%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#003d02', endColorstr='#005405',GradientType=1 );)
CelticEmpress wrote:
Just to test this a bit, is this too long? Does it matter how long the code is?

background: -webkit-linear-gradient(background: rgb(0,61,2);
background: -moz-linear-gradient(45deg, rgba(0,61,2,1) 3%, rgba(0,145,21,1) 26%, rgba(0,84,5,1) 90%);
background: -webkit-linear-gradient(45deg, rgba(0,61,2,1) 3%,rgba(0,145,21,1) 26%,rgba(0,84,5,1) 90%);
background: linear-gradient(45deg, rgba(0,61,2,1) 3%,rgba(0,145,21,1) 26%,rgba(0,84,5,1) 90%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#003d02', endColorstr='#005405',GradientType=1 );)

Nope :) can be as long as you need!

Moderators: Green Auberon