使用按钮应用 cursor:pointer 与 button:hover

Question

我想知道使用 button {cursor: pointer} 是否有一些缺点或不使用 button:hover {cursor: pointer} 的原因？

我觉得输入 button 而不是 button:hover 真的很脏，所以我想确保我没有做任何坏事。

Answer 1

两者之间没有真正的区别，也没有想到的问题。如果你加载下面的 HTML ，你可以看到即使有悬停效果使用光标更改为指针完全相同，就好像它没有使用过渡一样（这是我能想象的唯一效果它有）。如果您更喜欢使用 :hover 那么您可以；然而，最好尽量减少您编写的代码。

  <html>

<head>
    <title>Pointer</title>
</head>

<body>

    <button class="pointer">Pointer</button>
    <button class="hoverPointer">Hover Pointer</button>
</body>

<style>
    .pointer {
        cursor: pointer;
    }

    .hoverPointer:hover {
        -webkit-transition: 2s;
        transition: 2s;
        cursor: pointer;
        background-color: aqua;
    }

</style>

</html>

使用按钮应用 cursor:pointer 与 button:hover

Applying cursor:pointer with button vs button:hover

css

mouse-cursor