很久没来更新博客了，今天正好比较闲，就写一篇手头项目上遇到的一个css问题：
.mature .blur {
-webkit-filter:blur(25px);
-moz-filter:blur(25px);
filter: url(data:image/svg+xml;base64,77u/PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjxmaWx0ZXIgaWQ9ImJsdXIiPjxmZUdhdXNzaWFuQmx1ciBzdGREZXZpYXRpb249IjI1IiAvPjwvZmlsdGVyPjwvc3ZnPg==#blur);
filter: blur(25px);
filter:progid:DXImageTransform.Microsoft.Blur(PixelRadius='25');
transition: 1s filter linear;
}
Firefox可以使用filter+svg实现blur效果，url参数中原本使用的是svg路径#blur，svg、css、js都在CDN中，但发现这个svg在FF中不工作，图片显示为纯黑色，ORZ...于是想到了用base64来转码这个svg文件：
<svg>
<filter id="blur">
<feGaussianBlur stdDeviation="25" />
</filter>
</svg>
在线转码：http://b64.io/
转好后还是老问题，有点莫名，g了下发现，svg tag需要增加文档类型：
<svg version="1.1" xmlns="http://www.w3.org/2000/svg">
<filter id="blur">
<feGaussianBlur stdDeviation="25" />
</filter>
</svg>
刷新页面，问题解决。