如何在使用CSS/JavaScript的鏈接上停用？

我使用CSS將我的鏈接設置爲紅色，當我將鼠標懸停在它們上面時。點擊它們會打開一個新標籤，但我的鏈接仍然懸停（紅色）。是否有可能停止點擊按鈕？這看起來很糟糕，特別是在移動設備上。如何在使用CSS/JavaScript的鏈接上停用？

CSS: 
a:hover { 
color: red; 
} 

HTML: 
<a href="www.example.com" target="_blank">Open site in new tab, remains red</a>

來源

2016-07-04 iamarnold

我相信它的狀態是焦點不叮無縫的。你可能會爲焦點狀態添加不同的風格。 –

我認爲你必須使用'a：focus {一些css}'！ – MHS

鏈接即a標籤focus後我們剛纔點擊它並沒有點擊任何地方的狀態。所以，很可能你想改變你的錨標記的:focus狀態的樣式。

CSS: 
a:hover { 
color: red; 
} 
a, 
a:focus 
{ 
    color: green; /* or whichever is your default color */ 
} 

/* You can also add same or different style for a:visited state, which applies to anchor tags which have been visited */ 

HTML: 
<a href="www.example.com" target="_blank">Open site in new tab, remains red</a>

來源

2016-07-04 15:45:12

此外，如果您想要，您可以設置'a：visited'狀態。 – mxlse

@maxilo是的。謝謝。 –

@MohitBhardwaj我嘗試了重點和訪問，但它似乎不適合移動。在iOS Safari瀏覽器中，如果我打開一個指向具有移動版本的網站的鏈接（開放linkedin網站打開linkedin應用程序）並切換回Safari，該鏈接仍然保持紅色。點擊後有沒有一種方法可以讓你不重視？ – iamarnold

一種方式是點擊，你可以添加一個類具有原始背景顏色的不徘徊或在單擊時按鈕..

（本例中使用jQuery的）

$('.button').click(function() { 
 
\t $(this).addClass('button-onclick'); 
 
})

body { 
 
    display: flex; 
 
    justify-content: center; 
 
    align-items: center; 
 
    height: 100vh; 
 
    margin: 0; 
 
} 
 
.button { 
 
    display: flex; 
 
    justify-content: center; 
 
    align-items: center; 
 
    width: 200px; 
 
    height: 200px; 
 
    background-color: red; 
 
    border-radius: 100%; 
 
} 
 
.button:hover { 
 
    background-color: green; 
 
} 
 
.button-onclick:hover { 
 
    background-color: red; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="button">clickers</div>

小提琴

https://jsfiddle.net/Hastig/hL4dt60k/

來源

2017-05-13 06:48:25

如何在使用CSS/JavaScript的鏈接上停用？

回答

相關問題