更改按鈕顏色作爲背景顏色更改？

我創建了一個具有部分透明背景的固定按鈕，它在黑色背景中顯示時效果很好，但是當我將其顯示在淺色背景上時，它不可見。更改按鈕顏色作爲背景顏色更改？

我希望它在淺色和深色背景下均可讀取，即在淺色背景上顯示時按鈕應變爲較暗的顏色，反之亦然。

如何在JavaScript中對此進行編碼？

來源

2016-11-11 Alireza Ghadak

歡迎堆棧溢出。請解釋您嘗試的內容，添加一些代碼，展示示例並解釋問題。查看此[鏈接]（http://stackoverflow.com/help/mcve）瞭解如何改進您的問題。 –

從我的理解你有一個在HTML中聲明並具有RBGA背景屬性的按鈕，是否正確？有些方法可以用JS或Sass/Less來完成。在我們開始編寫代碼之前，您可以發佈您的HTML/CSS嗎？ – Falk

我會考慮使用諸如TinyColor之類的東西來檢測背景是否明亮或黑暗並適當地設置按鈕的樣式。

來源

2016-11-11 16:47:12 skav

有沒有辦法解決它使用特殊的CSS屬性。最好的解決方案是使用嵌套的CSS類。喜歡的東西：

CSS

.light-background { 
    background: white; 
} 
.light-background button { 
    background: gray; 
    color: white; 
} 
.dark-background { 
    background: gray; 
} 
.dark-background button { 
    background: white; 
    color: gray; 
}

HTML

<div class="light-background"> 
    <button>Light</button> 
</div> 
<div class="dark-background"> 
    <button>Dark</button> 
</div>

https://jsfiddle.net/bwd1mvwd/

來源

2016-11-11 16:52:01 aggiustino

更改按鈕顏色作爲背景顏色更改？

回答

相關問題