掌阅封面制作

KuaiKan 6月前 170

掌阅的封面全屏与多看不同,它是需要添加一个xml文件才能生效。

此XML文件命名为「zhangyue-expansion.xml」放在META-INF文件夹里(使用文本编辑器新建一个文本文档,粘贴下面的代码,然后重命名文件名并修改文件扩展名),内容如下:

<?xml version="1.0" encoding="UTF-8"?>
     <zhangyue-expansion version="3.4.2">
     <book_id></book_id>
</zhangyue-expansion>

掌阅对封面的全屏,不需要修改opf文件。而是为当前HTML添加图片背景,背景图片就是封面。对应的HTML代码:

<body class="background-img-center" style="background-image:url(../Images/cover.jpg);">
<table style="width:100%; height:100%;">
<tr style="height: 100%; text-align: right; vertical-align: bottom; zy-fontsize-adjust: fixed;">
<td><img alt="" src="../Images/zy-cover-logo.png" style="width: 18%;" zy-enlarge-src="none"/></td>
</tr>
</table>
</body>

zy-cover-logo.png文件是掌阅的logo,可以不添加。样式background-img-center的代码:

body.background-img-center {
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    zy-fontsize-adjust: fixed;
}

掌阅全屏依赖zhangyue-expansion.xml文件,请务必添加!

封面为三个版本:cover.jpg(Pad上的封面图)、coverpage.jpg(掌阅书城里的缩略图)、cover-phone.jpg(手机上的封面图),文件大小控制在1M以内。

掌阅封面尺寸参考:

cover.jpg —> 1536×2048

coverpage.jpg —> 300×400

cover-phone.jpg —> 720×1280

最新回复 (0)
返回