Question

我在使用阿拉伯语字体时遇到省略号的问题＆＃34; Droid Arabic Kufi＆＃34;在IE上。此错误仅在IE上发生，但是我修复了IE9上的问题，但是相同的代码在IE 11上不起作用。

错误是在IE11中呈现页面时，而不是显示省略号点（...）显示框。

请检查以下JSFIDDLE示例。

body{
    font-family : "Droid Arabic Kufi";
}
p{
    width:50px;
    text-overflow : ellipsis;
    overflow: hidden; 
    white-space: nowrap; 
    -ms-text-overflow: ellipsis; 
}

p:before{
 content : " ";
 font-family : "Arial";
}

p:after{
    content : " ";
     font-family : "Arial";
}

等待任何帮助。

由于

Answer 1

TypoThe Droid阿拉伯语Kufi字体不包含句点“。”字符（或任何其他Ascii字符，除了空格），因此当浏览器实现text-overflow: ellipsis时，他们必须从另一个中取出句号字体。显然某些版本的IE无法正确执行此操作，可能是因为它们错误地解释了字体信息（就好像字体包含“。”）。

解决方法是在font-family列表中添加一些合适的字体，以便从中获取“。”，例如

font-family : Verdana, "Droid Arabic Kufi";

此字体不应包含阿拉伯字符，因为该字体优先于列表中稍后提及的任何内容。该字体也应该在使用IE的所有系统中可用。没有绝对保证，但Verdana应该在所有Windows系统上，除非故意删除。

从技术上讲，这也意味着空格字符将取自该字体，而不是来自Droid Arabic Kufi。这可能在间距方面很重要。在Droid Arabic Kufi中，该空间的前进宽度为696个单位，在Verdana中为700个单位，因此应该没有实际差异。

IE11中的阿拉伯字体省略号问题

1 个答案: