html5中的真圆（或任何非矩形）元素？

我没有看到关于它们的任何文档，所以它们可能不存在，但检查一下总是好的

我正在寻找一个真正的圆形（或除矩形以外的任何类型的多边形）元素。我可以在画布上画一个圆，但画布仍然是一个矩形。我可以用边界半径画一个圆，但它仍然是一个正方形元素，有相当多的圆角

我正在寻找一种（简单的）方法来制作复杂形状的按钮，这些按钮在可点击区域上非常精确

---

我目前的方法是使用JavaScript，聆听点击并测量位置。如果在html5/css3中处理这一点会更加理想。

好吧，所有元素都以块、正方形或矩形的形式开始，以一种或另一种形式出现。除此之外，您还可以通过CSS操纵块，使其显示为圆形。但这并不是说并非所有浏览器都完全支持这一点，但本质上，你必须担心的主要是那些较旧的浏览器

如果你在寻找100%兼容的新旧产品，你可以在那里画一个，并使用图像标签。。但即使这样，图像仍然是正方形/矩形。无论你走哪条路，都无法逃避这种想法

总之

<div class="full-circle"></div>

.full-circle {
 background-color: #c06;
 border: 3px solid #333;
 height: 150px;
 border-radius:75px;
 -moz-border-radius:75px;
 -webkit-border-radius: 75px;
 width: 150px;
}

.整圈{
背景色：#c06；
边框：3px实心#333；
高度：150像素；
边界半径：75px；
-moz边界半径：75px；
-webkit边界半径：75px；
宽度：150px；
}

---

就您当前的方法而言，这是大多数情况下唯一合理的逻辑，做“规范”之外的事情通常需要比一行或三行代码多一点的工作量。

没有真正的圆形元素，但尝试使用常规的box元素和CSS3规范

border radius

。例如：

border-radius: 50px;
height: 50px;
width: 50px;
overflow: hidden;

---

这将创建一个实际上是圆形的元素，Firebug在元素上悬停时尊重曲线形式

边框半径只会使元素看起来更圆（据报道，firefox除外）

贴图是一种工作，但我希望避免强制使用图像

SVG可以工作，但它仍然不是纯html/css，因为链接工作需要javascript。SVG元素仍然是方形的，尽管其中的形状是能够很好地响应javascript事件的元素。所以它不是100%完美，但它是可行的

如果我们能够控制页面上元素的形状，而不仅仅是在画布中绘制，那肯定会更酷。也许我会在画布中构建一个完整的站点

---

谢谢你的建议

imagemap可能符合要求，但对于您的问题来说，它已经过时了。。。