：将{cursor：pointer}悬停在通过borderradius创建的圆上将使其成为指针，即使在圆外也是如此

Question

我使用border-radius创建了一个圆形按钮。我的问题是，当使用以下代码时： button:hover {cursor: pointer}光标即使在圆圈外也是一个指针（但在＆＃34;矩形div＆＃34;内）。我很确定我需要javascript才能解决这个问题（如果我错误地将CSS标记包含在内），但除此之外我还是空白，如果有人能指出我正确的方向，它会很棒！

感谢。

Answer 1

您可以使用SVG。 SVG具有跨浏览器功能。

<svg>
    <circle cx="40" cy="40" r="24"/>
</svg>

circle:hover{
    cursor: pointer;
    background: yellow;
}

DEMO：http://jsfiddle.net/DerekL/Jpnre/
MDN：https://developer.mozilla.org/en/CSS/Getting_Started/SVG_graphics