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

11

我在epub阅读器中遇到了问题,它可以正确显示所有内容,但是没有捕获CSS文件中的嵌入式字体。

当我在其他阅读器上运行同一文件时,嵌入式字体被显示出来,但是当我在像Firefox这样的浏览器上运行html文件时,它显示与我的应用程序相同的结果,并且不显示嵌入式字体。

这里是一个示例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];

我发现我提交给其他阅读器的文件与我在应用程序中使用的文件唯一的区别是,我向其他阅读器(如iBooks)提交.epub格式的文件,而我在应用程序中使用相同的文件带有.zip扩展名。 但我不确定这是否相关。为了显示epub中html文件的内容,我使用UIWebView。

唯一不同之处在于文件格式,但这可能与问题无关。


我已经添加了一张截图来展示它。 - coder
如果您需要其他详细信息,请告诉我。 - coder
这看起来不错。你能看到渲染的图片吗?比如“images/inner_cover_and_credits_page.jpg”。baseURL的值是多少?如果不是布局问题,那么可能是HTML/CSS或字体问题。我看到你将字体“GE SS Text Medium”应用于具有类“CharOverride-1”的span标签。在HTML中,你有一些阿拉伯文本。只要你的字体(GE SS)包含阿拉伯字符的字形,它就应该可以工作。是这样吗?我会尝试简化你的HTML和CSS到一个最小的例子,并在桌面上的独立Safari中使其工作,以找出问题所在。 - battlmonstr
是的,图像被正确地渲染出来了,文件的所有功能都正确显示,唯一遇到的问题是嵌入字体,它不使用嵌入字体而改用默认字体,尽管在iBooks上以epub格式呈现相同的文件时,嵌入字体会被正确地渲染出来。 - coder
你能否用仅包含3个文件的小测试:html、css和1个字体。在Safari中进行测试,并确保它无法工作。然后设置其他字体并再次测试。如果使用另一种字体可以正常工作,则是字体问题。在这种情况下,您需要调查字体本身出了什么问题。如果使用另一种字体仍然无法正常工作,则是HTML/CSS中的错误,应该很容易修复。在后一种情况下,请将简化的文件压缩成zip格式并分享,人们可以提供帮助。我感觉这是一个字体问题。 - battlmonstr
显示剩余8条评论
2个回答

2

并非所有字体都适合用于网络显示。您可以在此处检查您的字体。请注意,一些字体具有适用于网络、屏幕或移动设备的活动图标,而其他一些则没有。使用那些同时设计用于网络和屏幕的字体。

https://www.fontsquirrel.com/fonts/list/recent

感谢您的贡献,我非常感激您的意见。正如我之前所提到的,字体在iBooks阅读器上被捕获,但在我的阅读器上没有,因此这不是字体问题。 - coder

2
我可以确认这个问题。我尝试了您的HTML和CSS(进行了适应)与两种不同的阿拉伯字体("阿拉伯魔法""Mcs Book Title 3")。这些都是TTF字体,但也没有起作用。
应用时,在Web Inspector控制台中没有错误,字体已成功加载。当应用时,我实际上看到默认字体发生了一些变化:它增加了一点字母之间的间距,就是这样。在macOS上使用Firefox和Chrome时情况相同。
我猜测我们尝试的大多数字体可能不包含所有所需字符的字形,或者需要在浏览器引擎(包括UIWebView)能够成功检测和呈现它们之前对字体进行处理。
我知道这不是最终答案,但我只是在这里分享我的研究。希望它有助于继续深入研究问题。
相关问题:

更新:还尝试了windows-1256的阿拉伯编码(重新编码HTML,并应用元字符集),因为我认为utf-8对这些字体可能太复杂了,但得到了相同的结果:文本是用一些默认字体呈现的。


谢谢您分享您的问题,您有任何想法如何解决它吗?因为在其他应用程序中它显示得很完美。 - coder

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接