Jquery 跨浏览器文本笔划&；变得模糊不清

所以我试图在网页上产生photoshop文本效果。 基本上，文本是白色的，笔划外有一个黑色的轮廓和一个白色模糊

跨浏览器地狱

我一直在使用各种各样的文本阴影、文本笔划和ms过滤器，但无法在所有浏览器中获得一致的东西。Firefox显示了轮廓，但它是灰色的，似乎无法在IE中使用组合过滤器。以下是我的一项努力：

color: #FFF;
-webkit-text-fill-color: white;
-webkit-text-stroke-width: 2px;
-webkit-text-stroke-color: black;
text-shadow: 1px 1px 4px #ffffff, -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;
letter-spacing: -3px;
font-style: italic;
filter: glow(color=black,strength=1);  

我还使用带有@fontface的嵌入式字体

有没有人知道jquery解决方案可以让我设计这个文本的样式？ 我真的不想求助于图像，因为整个网站都在使用文本样式

非常感谢您的任何建议

太真实了，我有点含糊不清。昨晚很晚了，希望有一个神奇的jquery解决方案或类似的东西。到目前为止，我还没有使用SVG文本，所以今天早上我一定会尝试一下，因为它看起来可以处理大多数流行浏览器

我知道Photoshop和web设计是非常不同的，但我得到了PSD，必须尽我所能建立一个网站

我在Mac上工作，通过虚拟盒测试IE。目前，我正在使用IE9，但现在有一份IE10的副本正在下载以供进一步测试

这是我试图实现的一个jpg示例：

---

正如其他人所说，这将很困难；这很可能比它的价值更麻烦。此外，JQuery肯定不是适合此工作的工具

正如您已经发现的那样，

text shadow

样式将为您提供文本后面的模糊效果。如果文本大纲对您非常重要，我会使用内嵌SVG：

<svg>
    <text x="80" y="80" stroke="red" font-size="80px">Hi</text>
</svg>

你好

（请参阅内联SVG的跨浏览器兼容性：）

---

不幸的是，如果您使用内联SVG，则无法使用CSS的

文本阴影

，因此您必须使用创建SVG过滤器。

您不应该期望在web浏览器中再现Photoshop效果。它们是非常不同的程序。关于具体效果，您应该使用图像（或图像链接，在永久URL）准确地指定它们，并发布一份完整的可测试文档，显示您迄今为止的最大努力，通过浏览器更准确地描述结果（例如，“IE”是一个非常模糊的参考–IE 11预览、IE 10、IE 9或更早的版本？）。