是否可以overflow: visible在<svg>元素上设置？
这个关于 jsfiddle的简单示例在我可以访问的每个浏览器（某些版本的 Chrome 和 Firefox）中都会中断，因为它们的行为就像overflow: hidden.
谁能告诉我 svg 支持是否仍然太不成熟而无法做如此简单的事情，或者我在代码中做错了什么？
我的实际用途overflow: visible是图表上的范围轴，其中刻度的下半部分-0被切断。
问问题
32549 次
2 回答
32
我假设您的意思是 HTML 中的内联 <svg> 元素，如果是这样，那么这只是一个实现限制。IE9+ 允许overflow:visible使用 <svg> 元素，但到目前为止其他浏览器还没有 AFAIK。
一种可能的解决方法（这实际上是首先应该如何完成恕我直言）是指定一个viewBox定义svg内部坐标系的a。然后你在这个坐标系内绘制东西。如果东西被剪裁（或者换句话说，如果元素在viewBox区域之外），那么只需相应地增加viewBox宽度和/或高度。
如果您想知道您的特定 的良好默认值，请viewBox尝试[0 0 width height]（其中宽度和高度是您目前拥有的 svg 的大小），然后只需增加高度，直到底部刻度完全可见。
2014 年更新：
跨浏览器仍然有点不一致，但它已经到达那里。Firefox 和 IEoverflow:visible对内联 svg 元素的支持，并且 Blink (Opera 23/Chrome 36) 也增加了对它的支持，详情请参阅bugreport。
于 2012-09-08T13:15:56.397 回答
3
overflow: visible
box-shadow : 0px -0px 10000px transparent /*trick for chrome*/
向 SVG 添加一个巨大的 box-shadow ，或者将 SVG 添加到一个带有巨大阴影的 DIV 中解决它。在 Chrome 中，我注意到溢出被裁剪到 box-shadow 限制。
于 2017-06-19T08:28:17.400 回答