尽管HTML中没有样式变化，但网页中的字体在句子中间发生了变化。为什么？_Html_Css_Fonts

尽管HTML中没有样式变化，但网页中的字体在句子中间发生了变化。为什么？

html css fonts

尽管HTML中没有样式变化，但网页中的字体在句子中间发生了变化。为什么？,html,css,fonts,Html,Css,Fonts,我正试图建立一个wordpress博客（很不幸，是瑞典语），在一篇博文中，两个人相互独立，注意到字体在句子中间发生了变化：他们都使用Chrome运行Windows7，我曾尝试在我的linux、mac和iOS系统上复制这种字体更改，但对我来说，它的渲染器是正确的。例如，在使用最新firefox的Ubuntu上，字体保持不变：为什么会出现这种奇怪的行为？我能做些什么来纠正它？我真的不知道从哪里开始… 带段落的帖子是。这是段落后面的HTML呈现错误： <p><strong&g

我正试图建立一个wordpress博客（很不幸，是瑞典语），在一篇博文中，两个人相互独立，注意到字体在句子中间发生了变化：

他们都使用Chrome运行Windows7，我曾尝试在我的linux、mac和iOS系统上复制这种字体更改，但对我来说，它的渲染器是正确的。例如，在使用最新firefox的Ubuntu上，字体保持不变：

为什么会出现这种奇怪的行为？我能做些什么来纠正它？我真的不知道从哪里开始…

带段落的帖子是。这是段落后面的HTML呈现错误：

<p><strong>Rasmus:</strong> Groggen smakar frihet kamrat! 
Eller, nä&#8230; det smakar vodka — och — Coca-Cola, varken
mer eller mindre. Hade varit gott med lime i, men då är det 
ju ingen grogg längre&#8230;</p>

拉斯穆斯：格罗根·斯马卡尔·弗里赫特·卡姆拉特！
埃勒，nä&8230；det smakar伏特加-och-可口可乐，瓦尔肯
梅尔·埃勒·明德。我是一个中等身材的男人
ju ingen grogg längre和#8230

字体是驻留在Google字体上的字体

我将非常感谢任何提示开始调试这个

在该段中，将

nä…

更改为

nä…

。这三个点是选定字体系列中无法识别的字符，因此将其丢弃并强制执行默认渲染

您的字体系列设置为

“Cardo”、Helvetica、Arial、sans serif

当检测到

nä…

时，Cardo无法识别它，并将其更改为第二个最佳选项Helvetica，这是预期的

如果您想不惜一切代价强制使用Cardo字体，那么您可以使用

font-family:Cardo

。但是，出于各种原因，我建议不要这样做

这是Chrome字体处理中的一个棘手错误。有几种变通方法，但不清楚究竟是什么触发了bug，因此无法保证这些变通方法在所有情况下都有效

以下文档触发了Win 7上Chrome 31中的错误：

<!doctype html>
<meta charset=utf-8>
<title>Font changes mid sentence</title>
<link href='http://fonts.googleapis.com/css?family=Cardo'
     rel='stylesheet'>
<style>
body { font-family: Cardo, Courier New, monospace }
p { text-rendering: optimizeLegibility; }
</style>
<p><strong>Rasmus:</strong> Groggen smakar frihet kamrat! 
Eller, nä&#8230; det smakar vodka — och — Coca-Cola, varken
mer eller mindre. Hade varit gott med lime i, men då är det 
ju ingen grogg längre&#8230;</p>


字型在句中变化
正文{字体系列：Cardo，Courier New，monospace}
p{文本呈现：优化易读性；}
拉斯穆斯：格罗根·斯马卡尔·弗里赫·卡姆拉特！
埃勒，nä&8230；det smakar伏特加-och-可口可乐，瓦尔肯
梅尔·埃勒·明德。我是一个中等身材的男人
ju ingen grogg längre和#8230

示例渲染：

因此，从字符串“nä…”到行尾的所有字符都是次要字体（为了清晰起见，这里是新的）。这同样适用于包含第二次出现的“…”的整行

由于某种奇怪的原因，不包含“…”。因此，浏览器从另一种字体中选择该字符是很自然的；在其他浏览器上也会发生这种情况。但Chrome在字体处理上完全出错，因此它对后续字符也使用回退字体，向前到行尾，或向后到行首。（这方面可能有所不同。）

删除

文本呈现：优化易读性会使问题消失，因此这显然与字距或连字有关。这一假设得到了另一种解决问题的方法的支持，即将省略号字符包装在它自己的元素中，如…
当然，使用三个句点“…”而不是省略号“…”可以避免触发错误。但是这个bug可能是更一般的性质，当文本中的各种字符在使用的主字体中不存在时，它们可能会触发这个bug
省略号“…”在HTML中的表示方式并不重要（例如与数字引用和命名引用的对比）。
。我在Chrome on OS X上看起来不错。你能试着选择有问题的段落并检查它，看看它是否因为某种原因变成了一个单独的HTML元素吗？在文档加载后，是否有一些JavaScript在文本上运行操作？不，没有JavaScript。HTML在呈现的文档中看起来相同（使用firebug查看）。目前，我并不是在一个能够复制“bug”的系统上。可能是因为字体不支持…省略号（…）或em破折号？您能试试它是否能更好地与&hellip<代码>&8320似乎是一个ISO-8859-1实体，您的页面是UTF-8。这可能是造成这种奇怪的原因（仍然是一个浏览器bug tho）@Pekka웃 更奇怪。如果我只是“删掉”错误的段落，它会在chrome 29中正确渲染。还有另一个奇怪之处：如果你修改窗口宽度，导致行长变化，错误字体的文本量也会改变。但无论使用什么浏览器，这都是一个错误，不是吗？@Pekka웃, 这不是虫子。当OP粘贴nä…，最后三个“…”无法识别。不确定从何处剪切和粘贴。但是，当浏览器遇到无效字符时，为什么会期望浏览器更改字体样式？是的，但奇怪的是，它会影响以下字符，是吗？正如前面所说，即使字符实际上是无效的，浏览器也不会以这种方式工作。但事实并非如此。例如，它在我的Chrome OS X上被“正确渲染”。这不是一个解决方案，甚至也不是对问题的正确诊断。因此，事实上，我这边没有一个bug，很高兴听到！我将站点恢复为工作版本。如果有人想知道你的文本示例是对伏特加可乐（又名冷战）的回顾