Question

那里，

我的epub阅读器有问题，它正确显示所有内容，但它没有捕获css文件中的嵌入字体。

当我在其他阅读器上运行相同的文件时，显示嵌入的字体，但当我在其中一个浏览器上运行html文件时，如firefox，它显示与我的应用程序相同的结果，并且它不会显示嵌入的字体。

以下是html内容示例：

<html  dir="rtl"   xml:lang="ar"   lang="ar"  xmlns="http://www.w3.org/1999/xhtml" xmlns:epub="http://www.idpf.org/2007/ops">
    <head>
        <meta charset="utf-8" />
        <meta name="viewport" content="width=1332,height=794" />
        <title>the-title-3</title>
        <link href="css/idGeneratedStyles.css" rel="stylesheet" type="text/css" />
    </head>
    <body id="the-title-3" lang="en-GB" xml:lang="en-GB" style="width:1332px;height:794px">
        <div id="_idContainer003">
            <img class="_idGenObjectAttribute-1 _idGenObjectAttribute-2" src="image/inner_cover_and_credits_page.jpg" alt="" />
        </div>
        <div id="_idContainer004">
            <div style="width:11599.37px;height:2993.39px;position:absolute;top:0px;left:0px;-webkit-transform-origin: 0% 0%; -webkit-transform: translate(0px,3.93px) rotate(0deg) scale(0.05);transform-origin: 0% 0%; transform: translate(0px,3.93px) rotate(0deg) scale(0.05);">
                <p class="Basic-Paragraph ParaOverride-1"><span id="_idTextSpan000" class="CharOverride-1" style="position:absolute;top:13.65px;left:3168.24px;">الجملة الرئيسية في النص </span></p>
                <p class="Basic-Paragraph ParaOverride-1"><span id="_idTextSpan001" class="CharOverride-1" style="position:absolute;top:733.65px;left:831.71px;">&#9;&#9;&#9;&#9;&#9;&#9;&#9;&#9;&#9;&#9;&#9;الكاتبة</span></p>
            </div>
        </div>
    </body>
</html>

这是相应的css文件：

@font-face {
    font-family:"Futura Lt BT";
    font-style:normal;
    font-weight:normal;
    src : url("../font/FuturaBT-Light.TTF") format('truetype');
}
@font-face {
    font-family:"GE SS Text Light";
    font-style:normal;
    font-weight:300;
    src : url("../font/GESSTextLight-Light.otf") format('opentype');
}
@font-face {
    font-family:"GE SS Text Medium";
    font-style:normal;
    font-weight:500;
    src : url("../font/GESSTextMedium-Medium.otf") format('opentype');
}
@font-face {
    font-family:"Simplified Arabic";
    font-style:normal;
    font-weight:bold;
    src : url("../font/SimplifiedArabic-Bold.ttf") format('truetype');
}

body, div, dl, dt, dd, h1, h2, h3, h4, h5, h6, p, pre, code, blockquote         {
    margin:0;
    padding:0;
    border-width:0;
    text-rendering:optimizeSpeed;
}
div.Basic-Text-Frame {
    border-style:solid;
}
p.ParaOverride-1 {
    line-height:1;
    white-space:nowrap;
}
span.CharOverride-1 {
    color:#000000;
    font-family:"GE SS Text Medium", sans-serif;
    font-size:420px;
    font-style:normal;
    font-weight:500;
}

请在下面找到文件布局的屏幕截图：

在UIWebView中加载html的内容：

[readingWebView loadHTMLString:contents baseURL:baseURL];

我可以在其他阅读器上提交的文件和我在我的应用程序中使用的文件之间找到的唯一区别是，我将格式文件.epub 提交给其他阅读器，例如iBooks在我的应用程序中使用相同的文件扩展名.zip 。但我不确定这是否相关。要在epub中显示html文件的内容，我使用UIWebView。

感谢任何提示或指导。

Answer 1

并非所有字体都适合网络显示。您可以在此处检查字体。请注意，某些字体具有活动的Web，屏幕或移动图标，而有些则没有。同时使用专为Web和屏幕设计的字体。 https://www.fontsquirrel.com/fonts/list/recent

Answer 2

我可以确认这个问题。我尝试过使用2种不同的阿拉伯字体（"Arabic Magic"和"Mcs Book Title 3"）的HTML和CSS（改编）。这些是TTF字体，但也没有用。

应用后，Web Inspector控制台中没有错误，字体加载良好。同样在应用时，我实际上看到默认字体有点变化：它增加了字母之间的间距，就是这样。当我在macOS上尝试使用Firefox和Chrome时也是如此。

我的猜测是，我们尝试的那些字体很可能不包含要显示的所有字符的所有字形，或者在浏览器引擎（包括UIWebView）成功检测和呈现之前需要以某种方式处理字体它们。

我知道这不是一个确定的答案，但我只是在这里分享我的研究。希望继续深入研究这个问题会有所帮助。

电子书阅读器未捕获epub文件的嵌入字体

2 个答案: