按鈕鏈接樣式不起作用

我正在爲自舉而工作在自己的變更位置，我目前正在使用按鈕和鏈接。按鈕在按鈕元素內有錨點標記，但鏈接樣式顯示出來。按鈕鏈接樣式不起作用

HTML

<button class="btn-danger"><a href="#">Danger</a></button> 
<button class="btn-error"><a href="#">Error</a></button> 
<button class="btn-success"><a href="#">Success</a></button> 
<button class="btn-info"><a href="#">Info</a></button>

CSS

button.btn-info a:visited a:active a:link a:hover{ 
    color:#0066CC; 
    text-decoration: none; 
}

來源

2015-09-26 AnonyDev

您的HTML無效。你不能在按鈕中有鏈接（反之亦然）。試圖做到這一點往往會導致從瀏覽器到瀏覽器的不一致的交互結果。如果你想要一個鏈接，請使用鏈接。如果你想要一個按鈕，使用一個按鈕。不管你喜歡，應用CSS來使它看起來像。 – Quentin

^這是一個公平的評論 – MrCarrot

@Quentin然後我會怎麼做？我會做一個輸入元素，並將它的類型按鈕和動作的URL？ – AnonyDev

你錯過了逗號出來。你的CSS更改爲

button.btn-info a:visited, 
button.btn-info a:active, 
button.btn-info a:link, 
button.btn-info a:hover { 
    color:#0066CC; 
    text-decoration: none; 
}

編輯：

基於以上昆汀的評論，他是正確的，你的HTML是無效的。你不應該在按鈕裏面有一個錨點。因此，我建議你改變你的CSS：

.btn-info { 
    color:#0066CC; 
    text-decoration: none; 
}

然後請執行：根據您的應用程序

<button class="btn-info">Info</button>

：

<a href="#" class="btn-info">Info</a>

或。

來源

2015-09-26 16:22:52 MrCarrot

乾杯！我必須等待一段時間才能將其標記爲答案。 – AnonyDev

按鈕鏈接樣式不起作用

回答

相關問題