如何在排除特定 Span 元素的同時選擇性地為連結添加下劃線？

為連結和Span 元素設定不同的底線樣式

使用HTML 和CSS 時，通常需要在文字裝飾方面對連結和Span 元素進行不同的樣式設定。在某些情況下，您可能想要刪除連結內特定範圍元素的底線。然而，使用傳統的 CSS 選擇器這可能具有挑戰性。

目前的問題旨在實現這一目標，其中除了 ID 為「#myspan」的元素外，連結應帶有下劃線。最初，提供的 CSS 規則似乎對「#myspan」沒有影響，但是當樣式順序顛倒時，就會出現問題，在「#myspan」下劃線而不是連結。

解決方案：內嵌樣式

要解決此問題，需要進行簡單的 CSS 修改。透過使元素內聯區塊，它與連結的下劃線效果隔離：

a {
  text-decoration: underline;
}

a #myspan {
  color: black;
  display: inline-block;
}

a:active #myspan {
  color: grey;
}

a:visited #myspan {
  color: yellow;
}

a:hover #myspan {
  color: red;
}

此CSS程式碼確保連結帶有下劃線，而「#myspan」元素保持下劃線。此外，「#myspan」的顏色可以根據需要使用 CSS 規則進行自訂。

以上是如何在排除特定 Span 元素的同時選擇性地為連結添加下劃線？的詳細內容。更多資訊請關注PHP中文網其他相關文章！