背景圖片：網址和漸變

我有一些CSS可以在Chrome和Safari中使用。唯一的問題是它在Internet Explorer和Firefox中不起作用。我想我在這裏錯過了一些東西。我正在使用的代碼如下CSS：背景圖片：網址和漸變

.bg-img { 
    width: 100%; 
    height: 830px; 
    background-size: cover; 
    background-image: gradient(linear, left top, right bottom, color-stop(0%, rgba(223,237,202,0.9)), color-stop(100%, rgba(105,210,190,0.9))), url('../img/profileheader.jpg'); 
    background-image: -moz-gradient(linear, left top, right bottom, color-stop(0%, rgba(223,237,202,0.9)), color-stop(100%, rgba(105,210,190,0.9))), url('../img/profileheader.jpg'); 
    background-image: -webkit-gradient(linear, left top, right bottom, color-stop(0%, rgba(223,237,202,0.9)), color-stop(100%, rgba(105,210,190,0.9))), url('../img/profileheader.jpg'); 
    background-position: center center; 
}

的Html

<div class="bg-img"></div>

我需要-MS-梯度？我讀了一些不必要的地方。在此先感謝壽！

來源

2014-11-13 user3473484

ColorZilla將絕對解決這個問題給你。我不能告訴你這個工具有多少次挽救了我的臀部！ :)

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

來源

2014-11-13 19:38:48

是的，我已經看到了一個。唯一的問題是，你不能添加一個背景網址。而漸變本身不會導致問題。這是漸變和網址之間的結合。 – user3473484

我認爲你可以通過在漸變線之前添加backgroundimage來實現你想要的效果：url（'../ img/profileheader.jpg'） –

然後再次，也許我不確定你想要做什麼。 Url是指向備用圖片還是該圖片應該顯示在漸變的頂部？ –

而不是 '背景圖像' 試 '背景' 而已。背景適用於顏色和圖像。

來源

2014-11-14 06:01:30

我自己已經找到了解決方案。感謝您提供一些選擇！解決方案：

background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(223,237,202,0.9)), to(rgba(105,210,190,0.9))), url(''); /* Saf4+, Chrome */ 
background-image: -webkit-linear-gradient(top, rgba(223,237,202,0.9), rgba(105,210,190,0.9)), url(''); /* Chrome 10+, Saf5.1+ */ 
background-image: -moz-linear-gradient(top, rgba(223,237,202,0.9), rgba(105,210,190,0.9)), url(''); /* FF3.6+ */ 
background-image: -ms-linear-gradient(top, rgba(223,237,202,0.9), rgba(105,210,190,0.9)), url(''); /* IE10 */ 
background-image: -o-linear-gradient(top, rgba(223,237,202,0.9), rgba(105,210,190,0.9)), url(''); /* Opera 11.10+ */ 
background-image: linear-gradient(to bottom, rgba(223,237,202,0.9), rgba(105,210,190,0.9)), url(''); /* W3C */

至少在Firefox中工作，不確定在Internet Explorer中，我在Mac上工作。

來源

2014-11-14 10:27:19 user3473484

背景圖片：網址和漸變

回答

相關問題