css垂直漸變背景

我想要一個不使用圖像的垂直漸變。所以，我已經有了一些CSS在Firefox和Chrome上工作，但它不能在IE9中工作。css垂直漸變背景

background: #fff; 
background: -moz-linear-gradient(top, #46a5e5, #ffffff); 
background: -webkit-gradient(linear, left top, left bottom, from(#46A5E5), to(#ffffff)); 
filter: progid:DXImageTransform.Microsoft.gradient(StartColorstr='#46A5E5', EndColorstr='#ffffff', GradientType=0);

有什麼建議嗎？

來源

2011-06-09 Charlie

看起來像你錯過了到IE過濾器的日期前綴版本IE8 & 9 ..雖然上了年紀還在IE8工作

嘗試：

filter: progid:DXImageTransform.Microsoft.gradient(StartColorstr='#46A5E5', EndColorstr='#ffffff', GradientType=0); /* IE6/7/8 */ 
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#46a5e5', endColorstr='#ffffff')"; /* IE8/9 */ 
zoom: 1;

新版本必須不會被打破（它必須留在引號之間的一行）..

來源

2011-06-09 21:47:56 clairesuzy

我嘗試了所有在一行，並嘗試了確切的代碼在代碼塊的方式，但也正在努力在IE9上。 – Charlie 2011-06-10 13:17:42

@SquireCD，對不起，沒有9來檢查（沒有Win7，我愛我的XP！），但我**認爲**我已經讀過某處，但現在找不到，當然，規則的順序可能是重要的..你有沒有嘗試只用'-ms-filter'規則 - 不需要縮放 - 看看它是否在IE9中工作，並且背景（或背景色）是透明的？你可以給一個IE9的例子不工作，我可以測試其他8個可以測試9 ..我敢肯定，我們會到達那裏:) - 補充：事後......有沒有其他過濾器涉及到這裏。。 – clairesuzy 2011-06-10 17:47:55

不涉及其他過濾器。直到星期一我回到辦公室時（在家只有Linux），我無法測試IE上的任何更改。我不確定它是否有幫助，但這是我的整個CSS文件：http://pastebin.com/B2cWuAi9 類.headBodyFoot是我需要的漸變。 PS：道歉的草率代碼。我對CSS很新。 – Charlie 2011-06-11 02:42:53

This article from Smashing Magazine在爲使用CSS3的IE進行設計時可能對您有所幫助。

多年來我學到的一件事是你的網站在每個瀏覽器中看起來不完全相同，事實上它可以是一個好處，因爲我有過這樣的情況， IE瀏覽器（但仍然很專業）和一些喜歡用戶界面的用戶會使用IE訪問，而不是喜歡的FireFox或Chrome。

此外，隨着IE9，CSS3和HTML5的許多兼容性已被添加，所以使您的網站或Web應用程序在所有瀏覽器中看起來一致變得越來越簡單！

只是我的2美分...我希望它有幫助。

來源

2011-06-09 22:41:21 Ryan

試試這個...我認爲高度：1％會解決這個問題

background: #fff; 
background: -moz-linear-gradient(top, #46a5e5, #ffffff); 
background: -webkit-gradient(linear, left top, left bottom, from(#46A5E5), to(#ffffff)); 
filter: progid:DXImageTransform.Microsoft.gradient(StartColorstr='#46A5E5', EndColorstr='#ffffff', GradientType=0); 
height: 1%;

來源

2013-03-07 01:49:17

css垂直漸變背景

回答

相關問題