How to use Bootstrap 3 gradient for background in CSS?

I need help. How to use gradient bootstrap 3 ?
what should I do?. if the gradient should be set to "CSS", so how? I tried like this:

.footer { margin-top: 20px; background-image: #gradient >.vertical(#4F364C, #FFFFFF); } 
 <link href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css" rel="stylesheet" /> <footer id="footer" class="footer"> <div class="row row-footer"> <div class="col-xs-6 text-left left"> <small>© 2015 newbiecom</small> </div> <div class="col-xs-6 text-right"> <small>Support: Bootstrap Fontawesome</small> </div> </div> </footer> 

But that does not work.

+6
source share
3 answers

The correct linear-gradient syntax is:

 linear-gradient( [ <angle> | to <side-or-corner> ,]? <color-stop> [, <color-stop>]+ ) \---------------------------------/ \----------------------------/ Definition of the gradient line List of color stops where <side-or-corner> = [left | right] || [top | bottom] and <color-stop> = <color> [ <percentage> | <length> ]? 

 .footer { margin-top: 20px; background-image: linear-gradient(90deg, #4F364C, #FFFFFF); } 
 <link href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css" rel="stylesheet" /> <footer id="footer" class="footer"> <div class="row row-footer"> <div class="col-xs-6 text-left left"> <small>© 2015 newbiecom</small> </div> <div class="col-xs-6 text-right"> <small>Support: Bootstrap Fontawesome</small> </div> </div> </footer> 
+11
source

try this, just make sure it has the prefix:

 background-image: linear-gradient(top, #4F364C, #FFFFFF); 
+1
source

You are trying to use bootstrap gradient mixes . If you want to use them, you need to skip adding the background-image property in front of it. Therefore, in your case it will be:

 .footer { margin-top: 20px; #gradient >.vertical(#4F364C, #FFFFFF); } 
+1
source

Source: https://habr.com/ru/post/981279/


All Articles