2016-10-05 63 views
0

這裏是一個小提琴標準按鈕高亮消失的邊框樣式改變

https://jsfiddle.net/an5fg5t2/

.differentbutton { 
 
    margin: 1px; 
 
    border-radius: 4px; 
 
    border: 1px solid DarkGrey; 
 
    height: auto; 
 
    padding-top: 2px; 
 
    padding-bottom: 2px; 
 
}
<button> 
 
    standard 
 
</button> 
 

 
<button class="differentbutton"> 
 
    Different 
 
</button>

我所做的只是添加一些樣式,以便IE按鈕看起來相同作爲FF鉻和safari。但是,這種變化導致懸停中的高光消失。刪除所有樣式並逐個添加它們意味着邊框聲明會導致懸停時的高光無法工作。

我的搜索爲其他平臺帶來了複雜的問題。有沒有支持這種行爲的文檔?我如何通過修改來保持這種行爲?

+1

看不到問題是什麼,沒有:這裏的代碼懸停元素或小提琴? – Ricky

+0

@Ricky將鼠標懸停在小提琴上的按鈕上。一個亮點,另一個不亮。閱讀最後一個問題如何通過修改來保持這種行爲? – user1015711

+0

得到Ricky的同意 - 我在小提琴中徘徊了兩個按鈕,並且沒有懸停狀態。 –

回答

1

爲了得到它,當你將鼠標懸停突出顯示,你需要CSS的以下位添加到您的代碼:

.differentbutton:hover { 
    border: 1px solid Grey; 
} 

如果添加它的類.differentbutton下方,那麼當你將鼠標懸停在按鈕會爲您「突出顯示」按鈕,根據需要更改顏色。

+0

它是我之後懸停的淺藍色高光。 – user1015711

+0

正如我所說的改變顏色,你認爲合適的,你知道如何改變顏色值與十六進制/ RGB? – Ricky

+0

然後你可以改變方括號之間的CSS屬性/值爲'border:2px solid lightblue;'或類似的東西。但是,如果你特別想要'outline'屬性,事情會變得更復雜一些。 –