Xhtml 記述
» 1 1
画像 配置» 1
最大画像800KB
<head>
<title> </title>
</head>
<body>
<img src="../Images/image1.jpg" />
</body>
</html>
.opf : <meta>
<dc:language>ja</dc:language>
<meta property =“ rendition:layout ”> pre-paginated</meta>
<meta name="fixed- layout“ content ="true" />
<meta property="rendition:orientation">auto</meta>
<meta name="orientation-lock" content="none" />
<meta name="book-type" content="comic" />
<meta content="800x1200" name="original-resolution" />
<meta name="primary-writing-mode" content="horizontal-rl" />
.opf : <spain> 見開 表示 指定
<spine page-progression-direction="rtl" toc="ncx">
<itemref idref="p1" properties="page-spread-left" />
<itemref idref="p2" properties="page-spread-right layout-blank" />
<itemref idref="p3" properties="page-spread-left" />
<itemref idref="p4" properties="page-spread-right" />
<itemref idref="p5" properties="page-spread-left" />
<itemref idref="p6" properties="page-spread-right" />
画面 表示
<item href="Images/cover.jpg" id="my-cover-image" media-type="image/jpeg" /
<spine page-progression-direction="rtl" toc="ncx">
<itemref idref="p1" properties="page-spread-left" />
<itemref idref="p2" properties="page-spread-right layout-blank" />
<itemref idref="p3" properties="page-spread-left" />
<itemref idref="p4" properties="page-spread-right" />
<itemref idref="p5" properties="page-spread-left" />
<itemref idref="p6" properties="page-spread-right" />
</spine>
p1
p3 p2
白頁
p5 p4
表紙
p6
具体例 学ぶ
Kindle ー い本 作 イン
具体例 学ぶ
Kindle ー い本 作 イン
•
フ ー型 本 作 イン– 文字色 背景色 線 色 指定
color, background-color, border-color
– 縦組 行内 文字 左右位置 指定
vertical-align
– ージ内 縦組 左右中央揃え 非推奨
•
固定 イアウ 型 本 作 イン– メタ ータ 指定
<metadata> ～ </metadata>
47
フ ー型 本 作 イン
文字色 背景色 線 色 指定
color, background-color, border-color
49
ー ンプ 修正 ンプ
文字色 背景色 線 色 指定
color, background-color, border-color
border-color: #000000; /* border-color: #000000; */
ー ンプ 修正 ンプ
color border-color
フ 色 あ#000000
やbackground-color
フ色 あ
#ffffff
不必要 指定す ー ー側 背景色 指定し 場合 見え く 場合 あ す
不必要 色 指定 避け く さい
縦組 行内 文字 左右位置 指定
vertical-align
51
ー ンプ 修正 ンプ
縦組 行内 文字 左右位置 指定
vertical-align
ー ンプ 修正 ンプ
vertical-align: super; /* vertical-align: super; */
ビ 縦中横 傍線 混在す 要素へ
vertical-align
指定 期待通表示さ い場合 あ す
細 い イアウ 調整
vertical-align
指定 避け く さいージ内 縦組 左右中央揃え 非推奨
53
ー ンプ 修正 ンプ
ージ内 縦組 左右中央揃え 非推奨
<html .... class="hltr">
<head> .... </head>
<body class="p-text vrtl block-align-center">
<div class="main">
<p><span class="font-180per">蜘蛛 糸</span></p>
<p>芥川龍之介</p>
</div>
</body>
</html>
<html .... >
<head> .... </head>
<body class="p-text hltr">
<div class="vrtl block-align-center">
<div class="main">
<p><span class="font-180per">蜘蛛 糸</span></p>
<p>芥川龍之介</p>
</div>
</div>
</body>
</html>
ー ンプ 修正 ンプ
html body writing-mode
混在す 記述 ー し い せbody
以下 指定し く さいージ内 縦組 左右中央揃え 非推奨
55
ー ンプ 修正 ンプ
<html>
</html>
<html>
</html>
<body>
</body>
<body>
</body>
<div>
</div>
固定 イアウ 型 本 作 イン
メタ ータ 指定
<metadata>
～</metadata>
57
ー ンプ 修正 ンプ
メタ ータ 指定
<metadata>
～</metadata>
<metadata .... >
<meta
property="rendition:layout">pre-paginated</meta>
<meta
property="rendition:spread">lands cape</meta>
</metadata>
<metadata .... >
<meta
property="rendition:layout">pre-paginated</meta>
<meta name="original-resolution"
content="848x1200"/>
<meta name="primary-writing-mode"
content="horizontal-rl"/>
<meta name="book-type"
content="comic"/>
<meta
property="rendition:spread">lands cape</meta>
</metadata>
ー ンプ 修正 ンプ