Độ dốc tuyến tính trong trình duyệt Chrome và Safari

Question

Tôi gặp sự cố khi hiển thị dốc tuyến tính trong Safari và Chrome. Trong Firefox nó xuất hiện tốt.

tôi đang cố gắng:

background: -webkit-linear-gradient(center top , #9E9E9E, #454545) repeat scroll 0 0 transparent; 
background: -moz-linear-gradient(center top , #9E9E9E, #454545) repeat scroll 0 0 transparent; 
background:  -ms-linear-gradient(center top , #9E9E9E, #454545) repeat scroll 0 0 transparent; 
background:  -o-linear-gradient(center top , #9E9E9E, #454545) repeat scroll 0 0 transparent; 

Cảm ơn bạn đã giúp đỡ của bạn.

Answer 1

Hãy thử điều này - http://jsfiddle.net/fwkgM/1/

background-color: #9e9e9e; 
    background-image: linear-gradient(to bottom, #9e9e9e, #454545); 

CSS3 Please

Answer 2

Bạn cũng có thể thử điều này:

http://www.colorzilla.com/gradient-editor/

Đó là một máy phát điện CSS3 Gradient khá tốt. Nó đã làm việc tốt cho tôi. Mong nó cũng giúp được cho bạn! : D

Answer 3

background: -webkit-linear-gradient(left,transparent,black 50%,transparent); /* worked for me*/ 

Answer 4

Đối với khả năng tương thích trình duyệt chéo hãy thử như sau

background-color: #9e9e9e; /* fallback color if gradients are not supported */ 
background-image: -webkit-linear-gradient(bottom, rgb(213,12,18), #9e9e9e 40%); /* For Chrome 25 and Safari 6, iOS 6.1, Android 4.3 */ 
background-image: -moz-linear-gradient(to bottom, #9e9e9e 60%, #454545 100%); /* For Firefox (3.6 to 15) */ 
background-image:  -o-linear-gradient(to bottom, #9e9e9e 60%, #454545 100%); /* For old Opera (11.1 to 12.0) */ 
background-image:   linear-gradient(to bottom, #9e9e9e 60%, #454545 100%); /* Standard syntax; must be last */