【发布时间】：2012-06-20 05:49:06
【问题描述】：
有没有办法让图像的 SVG 版本在窗口调整大小时不被裁剪？
您可以在此处尝试调整窗口大小：
http://demosthenes.info/blog/532/Convert-Images-To-Black--White-With-CSS
或
http://www.read-design.co.uk/css3-grey-scale-image-filters/
请注意，当窗口较小时，图像的灰度版本与彩色版本的大小不同，即 SVG 在较小的窗口上被裁剪。
但是那些有 JS 的似乎扩展性很好： http://james.padolsey.com/demos/grayscale/
不幸的是，我尽可能避免使用 JS，而更喜欢带有一些 CSS 的更简单的 SVG 文件。
我正在尝试消化： https://developer.mozilla.org/en/CSS/Scaling_of_SVG_backgrounds
但这不是我需要的。
我需要两种图像状态：此处讨论的颜色和灰度，如果可能的话，只希望 SVG 正确缩放： Convert an image to grayscale in HTML/CSS
但不幸的是，灰度被裁剪，没有正确缩放。
我尝试添加“vector-effect="non-scaling-stroke"，但没有用。
有人知道这个问题的解决方法吗？
谢谢
更新： 我想我只是正确地注意到了我自己的问题。这与 SVG 版本变小无关，而是 SVG 版本在调整大小时被裁剪。我还必须更新我上面的整个问题。
【问题讨论】：
-
当我访问其中任何一个 URL 并在 OS X 上使用 Safari 5 调整窗口大小时，我看不到任何裁剪或更改。
-
我用它可以复制的方式回答自己。 Downvoter请阅读更新。我们并不总是知道答案，有时在这个过程中，光就出现了。