：在通过borderradius创建的圆上悬停{cursor：pointer}将使其成为一个甚至在圆外的指针

Question

我已经使用border-radius创建了一个圆形按钮。我的问题是，当使用下面的代码： button:hover {cursor: pointer}光标将是一个甚至在圆外（但在“矩形div”内）的指针。林非常确定我需要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