電子書籍の最小の例
先に結論から書きます。
電子書籍の最小の例の設定ファイル、XMLファイル、XHTMLファイル、CSSファイルの内容は、次のように成ります。
コピペした場合は、全角空白を半角空白かタブ記号に置換してください。
コピペして.epubファイルを作成する場合は、
cover.jpeg
episode2image1.jpeg
episode2image2.png
という三つの画像ファイルを用意してください。
cover.jpegは表紙画像に成ります。
次話で少し解説します。
mimetype
―――――――――――
application/epub+zip
―――――――――――
META-INF/container.xml
―――――――――――――――――――――――――――
<?xml version="1.0" encoding="UTF-8"?>
<container version="1.0" xmlns="urn:oasis:names:tc:opendocument:xmlns:container">
<rootfiles>
<rootfile full-path="xxx.opf" media-type="application/oebps-package+xml"/>
</rootfiles>
</container>
―――――――――――――――――――――――――――
xxx.opf
―――――――――――――――――――――――――――
<?xml version="1.0" encoding="UTF-8"?>
<package unique-identifier="pub-id" version="3.0" xmlns="http://www.idpf.org/2007/opf">
<metadata xmlns:dc="http://purl.org/dc/elements/1.1/">
<dc:identifier id="pub-id">urn:uuid:27D78B51-D315-3B84-940B-7071A5387E95</dc:identifier><!-- UUID -->
<dc:title>電子書籍のタイトル</dc:title>
<dc:language>ja</dc:language>
<meta property="dcterms:modified">2001-02-03T04:05:06Z</meta><!-- 最終更新日時 -->
</metadata>
<manifest>
<item id="css" href="common.css" media-type="text/css"/>
<item id="nav" href="nav.xhtml" media-type="application/xhtml+xml" properties="nav"/>
<item id="cover" href="cover.jpeg" media-type="image/jpeg" properties="cover-image"/>
<item id="index1" href="index1.xhtml" media-type="application/xhtml+xml"/>
<item id="index2" href="index2.xhtml" media-type="application/xhtml+xml"/>
<item id="episode2image1" href="episode2image1.jpeg" media-type="image/jpeg"/>
<item id="episode2image2" href="episode2image2.png" media-type="image/png"/>
</manifest>
<spine>
<itemref idref="index1"/>
<itemref idref="index2"/>
</spine>
</package>
―――――――――――――――――――――――――――
nav.xhtml
―――――――――――――――――――――――――――
<?xml version="1.0" encoding="UTF-8"?>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:epub="http://www.idpf.org/2007/ops" lang="ja" xml:lang="ja">
<head>
<title>目次</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
</head>
<body>
<nav epub:type="toc">
<ol>
<li><a href="index1.xhtml#episode1">第1話</a></li>
<li><a href="index2.xhtml#episode2">第2話</a></li>
</ol>
</nav>
</body>
</html>
―――――――――――――――――――――――――――
index1.xhtml
―――――――――――――――――――――――――――
<?xml version="1.0" encoding="UTF-8"?>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:epub="http://www.idpf.org/2007/ops" lang="ja" xml:lang="ja">
<head>
<title>電子書籍のタイトル</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<link href="common.css" rel="stylesheet" type="text/css"/>
</head>
<body>
<h1>電子書籍のタイトル</h1>
<h2 id="episode1">第1話</h2>
<p>第1段落</p>
<p>第2段落</p>
</body>
</html>
―――――――――――――――――――――――――――
index2.xhtml
―――――――――――――――――――――――――――
<?xml version="1.0" encoding="UTF-8"?>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:epub="http://www.idpf.org/2007/ops" lang="ja" xml:lang="ja">
<head>
<title>電子書籍のタイトル</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<link href="common.css" rel="stylesheet" type="text/css"/>
</head>
<body>
<h2 id="episode2">第2話</h2>
<p>第3段落</p>
<p>第4段落</p>
<img id="episode2image1" src="episode2image1.jpeg" />
<img id="episode2image2" src="episode2image2.png" />
</body>
</html>
―――――――――――――――――――――――――――
common.css
――――――――――――――――
h1 {
margin: 0;
display: block;
width: 100%;
text-align: center;
font-size: 2rem;
font-weight: bold;
}
h2 {
margin: 0;
margin-bottom: 1.5rem;
page-break-before: always;
display: block;
width: 100%;
text-align: center;
font-size: 1.5rem;
font-weight: bold;
}
p {
margin: 0;
}
img {
display: block;
height: 90%;
margin: auto;
}
――――――――――――――――
