首頁 > web前端 > css教學 > 為什麼我的 div 在懸停時不改變顏色,只有其中的連結改變顏色?

為什麼我的 div 在懸停時不改變顏色,只有其中的連結改變顏色?

DDD
發布: 2024-11-03 18:43:02
原創
428 人瀏覽過

Why doesn't my div change color on hover, only the link inside it?

在懸停時更改 Div 背景顏色

問:我試圖在滑鼠懸停在 div 上時更改其背景顏色。我嘗試使用下面提供的 CSS 程式碼,但只有 div 內的連結改變顏色。如何讓整個 div 在懸停時改變顏色?

CSS 程式碼:

the div {background: white;}
the div a:hover {background: grey; width: 100%; display: block; text-decoration: none;}
登入後複製

A:CSS 程式碼中的「a:hover」專門針對 標籤,僅導致連結在懸停時改變顏色。要更改整個 div 的背景顏色,您需要使用“the div:hover”。這是更正後的程式碼:

the div {background: white;}
the div:hover {background: grey;}
登入後複製

此外,如果您希望整個div 充當鏈接,您可以在其周圍添加 標籤以及所需的鏈接地址:

<a href="link_address">
  <div style="background: white;">
    ...
  </div>
</a>
登入後複製

請注意,如果您只想更改特定的div,您可以在HTML 中為其指定ID 或類,並在CSS 中使用該標識符來定位它。

以上是為什麼我的 div 在懸停時不改變顏色,只有其中的連結改變顏色?的詳細內容。更多資訊請關注PHP中文網其他相關文章!

來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板