使用'pointer-events: none”停用懸停事件時如何套用遊標樣式？

使用指標事件停用懸停事件時新增遊標屬性：無

使用指標事件停用懸停事件：無有時會阻止遊標樣式的應用。這是因為pointer-events: none有效地使元素對滑鼠互動不可見，包括更改遊標樣式。

要解決此問題，應將遊標屬性應用於包含帶有指標的元素的父元素- 事件：無。這允許將遊標樣式套用至父元素，同時仍會停用子元素的懸停事件。

範例：

HTML：

<div class="container">
  <a href="#">Link</a>
</div>

CSS:

.container {
  cursor: pointer;
}
.container a {
  pointer-events: none;
  color: blue;
}

在此範例中，光標屬性應用於.container 類，其中包含 。關聯。這允許遊標在懸停在容器上時更改為指針，即使連結本身俱有指針事件：沒有應用。

請注意，使用此方法時可能會出現瀏覽器不一致的情況。例如，在 IE11 中，可能需要偽元素來確保相容性。此偽元素的寬度和高度應設定為 100%，位置設定為絕對，覆蓋父元素的整個區域。

以上是使用'pointer-events: none”停用懸停事件時如何套用遊標樣式？的詳細內容。更多資訊請關注PHP中文網其他相關文章！