2016-09-17 3 views
0

Как сделать линейный фон одного цвета (обе стороны склона) в div. пожалуйста, помогитеCSS Линейный цвет фона

background: rgb(0, 255, 113); 
background: -moz-linear-gradient(49deg, rgb(0, 255, 113) 42%, rgb(90, 140, 250) 0%); 
background: -webkit-linear-gradient(49deg, rgb(0, 255, 113) 42%, rgb(90, 140, 250) 0%); 
background: -o-linear-gradient(49deg, rgb(0, 255, 113) 42%, rgb(90, 140, 250) 0%); 
background: -ms-linear-gradient(49deg, rgb(0, 255, 113) 42%, rgb(90, 140, 250) 0%); 
background: linear-gradient(139deg, rgb(0, 255, 113) 42%, rgb(90, 140, 250) 0%); 

https://jsfiddle.net/52254dte/

enter image description here

ответ

1

Если вы не хотите, градиент ... затем удалить градиенты ...

т.е. использовать background: rgb(0, 255, 113); только ...
(или любой другой цвет, который вы хотите).

Fiddle update

После ясности .... просто добавить цвет перестает градиент .....

div { 
 
\t text-align: center; 
 
    color: #fff; 
 
    margin: 30px; 
 
    padding: 10px 0; 
 
    
 
    
 
\t background: rgb(0, 255, 113); 
 
background: -moz-linear-gradient(49deg, rgb(0, 255, 113) 30%, rgb(90, 140, 250) 30%, rgb(90, 140, 250) 70%, rgb(0, 255, 113) 70%); 
 
background: -webkit-linear-gradient(49deg, rgb(0, 255, 113) 30%, rgb(90, 140, 250) 30%, rgb(90, 140, 250) 70%, rgb(0, 255, 113) 70%); 
 
background: -o-linear-gradient(49deg, rgb(0, 255, 113) 30%, rgb(90, 140, 250) 30%, rgb(90, 140, 250) 70%, rgb(0, 255, 113) 70%); 
 
background: -ms-linear-gradient(49deg, rgb(0, 255, 113) 30%, rgb(90, 140, 250) 30%, rgb(90, 140, 250) 70%, rgb(0, 255, 113) 70%); 
 
background: linear-gradient(139deg, rgb(0, 255, 113) 30%, rgb(90, 140, 250) 30%, rgb(90, 140, 250) 70%, rgb(0, 255, 113) 70%);}
<div>Some Text</div>

+0

мне нужно, как на изображении выше. Можно ли сделать css3? – Anoops

+1

Ясность в вопросе послужит вам тогда хорошо. – Scott

1

использовать градиент, но сделать фактические изменения в цвет очень маленький (например, 0,1%)

linear-gradient(135deg, #ff0000 0%, #ff0000 29.9%, #ffffff 30%, #ffffff 70%, #ff0000 70.1%, #ff0000 100%) 

Используя этот метод, мы переходим от 0% до 29,9% с сплошным цветом, затем переходим к другому цвету с 29,9% до 30%.

div { 
 
    display: block; 
 
    width: 300px; 
 
    height: 100px; 
 
    
 
    background: -moz-linear-gradient(-45deg, #ff0000 0%, #ff0000 29.9%, #ffffff 30%, #ffffff 70%, #ff0000 70.1%, #ff0000 100%); 
 
    background: -webkit-linear-gradient(-45deg, #ff0000 0%, #ff0000 29.9%, #ffffff 30%, #ffffff 70%, #ff0000 70.1%, #ff0000 100%); 
 
    background: linear-gradient(135deg, #ff0000 0%, #ff0000 29.9%, #ffffff 30%, #ffffff 70%, #ff0000 70.1%, #ff0000 100%); 
 
}
<div></div>

Смежные вопросы