如何在漸變結束後顯示白色而不是灰色？

我有背景顏色/漸變下面的CSS：如何在漸變結束後顯示白色而不是灰色？

background-color: #FFFFFF; 
background: -moz-linear-gradient(top, #d7d6d2, #f9ffff); 
background-image: linear-gradient(top, #d7d6d2, #f9ffff); 
background-image: -o-linear-gradient(top, #d7d6d2, #f9ffff); 
background-image: -moz-linear-gradient(top, #d7d6d2, #f9ffff); 
background-image: -webkit-linear-gradient(top, #d7d6d2, #f9ffff); 
background-image: -ms-linear-gradient(top, #d7d6d2, #f9ffff);

使用這個我能夠完成我的需要，但在梯度結束後有一個淺灰色，而不是白色。我能做些什麼，以便漸變結束後白色開始顯示？

來源

2013-04-18 AAA

您可以詳細說明您嘗試設計的HTML佈局嗎？ –

將容器背景設置爲白色。在這種情況下，它與HTML和身體DEMO http://jsfiddle.net/kevinPHPkevin/RxXHz/

CSS

html { 
    height:100%; 
    background-color: #FFFFFF; 
} 
body { 
    padding:0; 
    margin:0; 
    width:100%; 
    height:100%; 
    background-color: #FFFFFF; 
    background: -moz-linear-gradient(top, #d7d6d2, #f9ffff); 
    background-image: linear-gradient(top, #d7d6d2, #f9ffff); 
    background-image: -o-linear-gradient(top, #d7d6d2, #f9ffff); 
    background-image: -moz-linear-gradient(top, #d7d6d2, #f9ffff); 
    background-image: -webkit-linear-gradient(top, #d7d6d2, #f9ffff); 
    background-image: -ms-linear-gradient(top, #d7d6d2, #f9ffff); 
}

來源

2013-04-18 18:11:37 Vector

您的解決方案可能會正常工作。但我意識到你的修改影響了我的一些divs。我會看看我是否可以在div中移動以適應此情況。謝謝！ – AAA

這樣做是看你的漸變定義，你爲什麼不設置結束顏色爲純白色：

background-image: linear-gradient(top, #d7d6d2, #ffffff);

目前，你的結局顏色是如此接近白色#f9ffff，大多數人不會有足夠的眼睛來區分差異。

來源

2013-04-18 18:17:11

謝謝馬克。但是這樣做會弄亂配色方案。 – AAA

該漸變的白色部分將轉到分配給它的任何元素的底部。我的猜測是你有什麼東西在它被賦予的東西之外，那不是白色的。

來源

2013-04-18 18:17:36 Sean

我重複檢查，但似乎無法找到任何衝突。謝謝肖恩！ – AAA

如何在漸變結束後顯示白色而不是灰色？

回答

相關問題