Skip to content

Instantly share code, notes, and snippets.

@takahashim
Last active August 29, 2015 14:17
Show Gist options
  • Save takahashim/421ae77c76baf019a5f2 to your computer and use it in GitHub Desktop.
Save takahashim/421ae77c76baf019a5f2 to your computer and use it in GitHub Desktop.
電書協 EPUB 3 制作ガイド ver.1.1.3、2014年11月1日版と2015年1月1日版の差分(PDFからtext抽出してdiff -u -w した結果)
--- 20141101-ebpaj-guide-v113.txt 2015-03-18 17:30:32.000000000 +0900
+++ 20150101-ebpaj-guide-v113.txt 2015-03-23 17:58:28.000000000 +0900
@@ -1,5 +1,5 @@
電書協 EPUB 3 制作ガイド ver.1.1.3
-2014/11/01
+2014/11/01(2015/01/01 更新)
目次
@@ -45,7 +45,6 @@
79 カスタマイズ
80 独自 CSS ファイルの作成
81 更新履歴
-
このガイドについて
■目的
@@ -67,6 +66,7 @@
+
■概要
この「電書協 EPUB 3 制作ガイド」は主として組み方向の混在や段組などのないシンプルな体裁の書籍を、リフロー型の電子書籍として記述するための指針として用意されました。ページ内の任意の場所にテキストや画像を配置したり、画像の周囲をテキストが回り込むようなデザイン、凝った見出しのレイアウト等については今回見送っています。
@@ -544,7 +544,7 @@
テキストレベルの意味づけ
em要素 / strong要素 / pre要素 / subとsup要素 / i要素 / b要素 / u要素 / s要素 / small要素
cite要素 / q要素 / dfn要素 / abbr要素 / time要素 / code要素 / var要素 / samp要素 / kbd要素
-mark要素 / rp要素 / bdi要素 / bdo要素 / wbr要素 / rb要素 / rtc要素 / rp要素
+mark要素 / bdi要素 / bdo要素 / wbr要素 / rb要素 / rtc要素 / rp要素
訂正
ins要素 / del要素
組込コンテンツ
@@ -2101,7 +2101,6 @@
・傍線
【CSS class】
-class="decoration-none" : 傍線、打ち消し線のクリア
class="em-line" : 縦組み時は右線、横組み時は下線
class="em-line-outside" : 縦組み時は左線、横組み時は上線
@@ -2116,7 +2115,6 @@
二重線での打ち消しなどは、外字画像化。
【CSS class】
-class="decoration-none" : 傍線、打ち消し線のクリア
class="line-through" : 打ち消し線(一本線)
例)
@@ -2190,6 +2188,7 @@
max-size-*em : 画像の高さと幅の最大値を、文字数で指定
max-size-***per : 画像の高さと幅の最大値を、画面の高さと幅に対する比率で指定
+※その他、auto、none、0 など、利用可能な値は後述の「■ボックスの扱い」→「サイズ」の項を参照
例)画像を縮小して行内に表示
---------------------------------[sample code]---------------------------------
@@ -2417,7 +2416,7 @@
なお、CSS では margin を用いて位置を調整しているため、同じ要素内で余白の margin と同時に指定しないこと。
【CSS class】
-class="start-*em"
+class="start-*em" ("start-0" も可)
例)行頭から一括で4字下げ
---------------------------------[sample code]---------------------------------
@@ -2447,7 +2446,7 @@
字下げ同様、同じ要素内で余白の margin と同時に指定しないこと。
【CSS class】
-class="end-*em"
+class="end-*em" ("end-0" も可)
例)行末から4字上げ
---------------------------------[sample code]---------------------------------
@@ -2456,14 +2455,13 @@
</div>
-------------------------------------------------------------------------------
-
・行頭インデント
【備考】
行頭からのインデントを行います。字下げとの違いは、行の先頭しか下がらないことです。
横組みのときは左から、縦組みのときは天から字下げされます。
【CSS class】
-class="indent-*em" : 行頭からのインデントを文字数で指定
+class="indent-*em" : 行頭からのインデントを文字数で指定 ("indent-0" も可)
例)一括行頭1字下げ
---------------------------------[sample code]---------------------------------
@@ -2482,7 +2480,7 @@
なお、CSS では indent のマイナス値と padding を用いて位置を調整しているため、同じ要素内で余白の padding と同時に指定しないこと。
【CSS class】
-class="h-indent-*em" : 折り返した行の開始位置を、行頭からの文字数で指定
+class="h-indent-*em" : 折り返した行の開始位置を、行頭からの文字数で指定("h-indent-0" も可)
例)折り返した行を、1行目の3文字目と頭を揃えて表示
---------------------------------[sample code]---------------------------------
@@ -2548,10 +2546,9 @@
縦中横を含む文章に文字間の指定をすると、縦中横で結合されたはずの文字のあいだにまで指定が効くことがあります。CSS の仕様では、縦中横を含む文字列に文字間指定された際の挙動が定められていないため、このような状況での利用は、なるべく避けることを推奨します。
なお、この現象を避けるため、縦中横部分に文字間ゼロの指定をすると、今度は縦中横した文字とその下の文字の間での文字間の指定が反映されなくなる場合がありますので注意してください。
-
【CSS class】
class="lspacing-normal" : 文字間を RS のデフォルトに
-class="lspacing-*em" : 文字間を 文字数で指定
+class="lspacing-*em" : 文字間を 文字数で指定("lspacing-0" も可)
例)4分アキに
---------------------------------[sample code]---------------------------------
@@ -2598,6 +2595,7 @@
</div>
-------------------------------------------------------------------------------
+
・長い単語の改行ルール
【備考】
空白などのない長い欧文文字列は、行末で折り返されず、画面の外にはみ出してしまう場合があります。
@@ -2788,17 +2786,17 @@
class="p-*"
[値の詳細]
-p-auto / p-0 / p-***per / p-*em : 四方のマージンを指定(auto、ゼロ、%指定、文字数指定)
+p-0 / p-***per / p-*em : 四方のパディングを指定(ゼロ、%指定、文字数指定)
-p-top-auto / p-top-0 / p-top-***per / p-top-*em : 画面上部のマージンを指定
-p-bottom-auto / p-bottom-0 / p-bottom-***per / p-bottom-*em : 画面下部のマージンを指定
-p-right-auto / p-right-0 / p-right-***per / p-right-*em : 画面右部のマージンを指定
-p-left-auto / p-left-0 / p-left-***per / p-left-*em : 画面左部のマージンを指定
-
-p-start-auto / p-start-0 / p-start-***per / p-start-*em : 行頭のマージンを指定
-p-end-auto / p-end-0 / p-end-***per / p-end-*em : 行末のマージンを指定
-p-before-auto / p-before-0 / p-before-***per / p-before-*em : 行前方のマージンを指定
-p-after-auto / p-after-0 / p-after-***per / p-after-*em : 行後方のマージンを指定
+p-top-0 / p-top-***per / p-top-*em : 画面上部のパディングを指定
+p-bottom-0 / p-bottom-***per / p-bottom-*em : 画面下部のパディングを指定
+p-right-0 / p-right-***per / p-right-*em : 画面右部のパディングを指定
+p-left-0 / p-left-***per / p-left-*em : 画面左部のパディングを指定
+
+p-start-0 / p-start-***per / p-start-*em : 行頭のパディングを指定
+p-end-0 / p-end-***per / p-end-*em : 行末のパディングを指定
+p-before-0 / p-before-***per / p-before-*em : 行前方のパディングを指定
+p-after-0 / p-after-***per / p-after-*em : 行後方のパディングを指定
例)四方のパディングを2文字分に
@@ -2863,7 +2861,6 @@
そのため、ページフィット画像への罫線は、囲み罫含め禁止とします。
【CSS class】
-class="k-clear" : 罫線のクリア
class="k-solid" : 実線の囲み罫
class="k-dotted" : 点線の囲み罫
class="k-double" : 二重線の囲み罫
@@ -2889,8 +2886,6 @@
・罫線
【CSS class】
-class="k-clear" : 罫線のクリア
-
線種
class="k-solid-*" : 実線
class="k-dotted-*" : 点線
@@ -3356,6 +3351,415 @@
更新履歴
+[2015/01/01 ver.1.1.3]
+----------------------------------------
+ガイド本体
+
+
+■P.1 / 追加
+
+【変更前】2014/11/01
+【変更後】2014/11/01(2015/01/01 更新)
+
+
+■P.17 / 削除
+「リーディングシステムに期待する動作」
+→「■本ガイドでは、RS による対応を想定しない HTML 要素と CSS プロパティ」
+→「【HTML】」
+→「テキストレベルの意味づけ」
+
+【変更後】重複していたため、以下をひとつ削除
+rp要素
+
+
+■P.53 / 削除
+「書式一覧」
+→「■強調・打ち消し」
+→「・傍線」
+→「【CSS class】」
+
+【変更後】サンプル CSS 中に定義がないため、以下を削除
+class="decoration-none" : 傍線、打ち消し線のクリア
+
+
+■P.53 / 削除
+「書式一覧」
+→「■強調・打ち消し」
+→「・打ち消し線」
+→「【CSS class】」
+
+【変更後】サンプル CSS 中に定義がないため、以下を削除
+class="decoration-none" : 傍線、打ち消し線のクリア
+
+
+■P.55 / 追加(記載漏れ追加)
+「書式一覧」
+→「■画像」
+→「・画像のサイズ指定」
+→「【CSS class】」
+
+【変更後】以下の一文を追加
+※その他、auto、none、0 など、利用可能な値は後述の「■ボックスの扱い」→「サイズ」の項を参照
+
+
+■P.60 / 追加(記載漏れ追加)
+「書式一覧」
+→「■字下げ・インデント」
+→「class 指定による字下げ」
+→「【CSS class】」
+
+【変更前】class="start-*em"
+【変更後】class="start-*em" ("start-0" も可)
+
+
+■P.60 / 追加(記載漏れ追加)
+「書式一覧」
+→「■字下げ・インデント」
+→「字上げ」
+→「【CSS class】」
+
+【変更前】class="end-*em"
+【変更後】class="end-*em" ("end-0" も可)
+
+
+■P.61 / 追加(記載漏れ追加)
+「書式一覧」
+→「■字下げ・インデント」
+→「行頭インデント」
+→「【CSS class】」
+
+【変更前】class="indent-*em"
+【変更後】class="indent-*em" ("indent-0" も可)
+
+
+■P.61 / 追加(記載漏れ追加)
+「書式一覧」
+→「■字下げ・インデント」
+→「突き出しインデント(ぶら下がりインデント)」
+→「【CSS class】」
+
+【変更前】class="h-indent-*em"
+【変更後】class="h-indent-*em" ("h-indent-0" も可)
+
+
+■P.63 / 追加(記載漏れ追加)
+「書式一覧」
+→「■行や文字の間隔」
+→「文字間」
+→「【CSS class】」
+
+【変更前】class="lspacing-*em" : 文字間を 文字数で指定
+【変更後】class="lspacing-*em" : 文字間を 文字数で指定("lspacing-0" も可)
+
+
+■P.68 / 誤植修正・削除
+「書式一覧」
+→「■ボックスの扱い」
+→「・内側の余白(パディング)」
+
+CSS2.1 仕様及びサンプル CSS 中に定義がないため、auto 関連を削除
+「マージン」を「パディング」に修正
+
+【変更前】
+[値の詳細]
+p-auto / p-0 / p-***per / p-*em : 四方のマージンを指定(auto、ゼロ、%指定、文字数指定)
+
+p-top-auto / p-top-0 / p-top-***per / p-top-*em : 画面上部のマージンを指定
+p-bottom-auto / p-bottom-0 / p-bottom-***per / p-bottom-*em : 画面下部のマージンを指定
+p-right-auto / p-right-0 / p-right-***per / p-right-*em : 画面右部のマージンを指定
+p-left-auto / p-left-0 / p-left-***per / p-left-*em : 画面左部のマージンを指定
+
+p-start-auto / p-start-0 / p-start-***per / p-start-*em : 行頭のマージンを指定
+p-end-auto / p-end-0 / p-end-***per / p-end-*em : 行末のマージンを指定
+p-before-auto / p-before-0 / p-before-***per / p-before-*em : 行前方のマージンを指定
+p-after-auto / p-after-0 / p-after-***per / p-after-*em : 行後方のマージンを指定
+
+【変更後】
+[値の詳細]
+p-0 / p-***per / p-*em : 四方のパディングを指定(ゼロ、%指定、文字数指定)
+
+p-top-0 / p-top-***per / p-top-*em : 画面上部のパディングを指定
+p-bottom-0 / p-bottom-***per / p-bottom-*em : 画面下部のパディングを指定
+p-right-0 / p-right-***per / p-right-*em : 画面右部のパディングを指定
+p-left-0 / p-left-***per / p-left-*em : 画面左部のパディングを指定
+
+p-start-0 / p-start-***per / p-start-*em : 行頭のパディングを指定
+p-end-0 / p-end-***per / p-end-*em : 行末のパディングを指定
+p-before-0 / p-before-***per / p-before-*em : 行前方のパディングを指定
+p-after-0 / p-after-***per / p-after-*em : 行後方のパディングを指定
+
+
+■P.69 / 削除
+「書式一覧」
+→「■罫線」
+→「・囲み罫」
+→「【CSS class】」
+
+【変更後】サンプル CSS 中に定義がないため、以下を削除
+class="k-clear" : 罫線のクリア
+
+
+■P.70 / 削除
+「書式一覧」
+→「■罫線」
+→「・罫線」
+→「【CSS class】」
+
+【変更後】サンプル CSS 中に定義がないため、以下を削除
+class="k-clear" : 罫線のクリア
+
+
+
+----------------------------------------
+CSS機能一覧.pdf
+
+
+■標題 / 追加
+
+【変更前】CSS 機能一覧 (電書協ガイド ver.1.1.3)
+【変更後】CSS 機能一覧 (電書協ガイド ver.1.1.3 [2015/01/01 更新])
+
+
+■文字装飾 / 表記調整
+→「文字サイズ」
+→「css」
+
+【変更前】*[em|%];
+【変更後】[*em|*%];
+
+
+■圏点・傍点 / 誤植修正
+→「二重円」(.em-double-circle)
+→「使用例」
+
+【変更前】<p>テキスト<span class="em-double">傍点</span>テキスト</p>
+【変更後】<p>テキスト<span class="em-double-circle">傍点</span>テキスト</p>
+
+
+■圏点・傍点 / 誤植修正
+→「二重円(白抜き)」(.em-double-circle-open)
+→「使用例」
+
+【変更前】<p>テキスト<span class="em-double-open">傍点</span>テキスト</p>
+【変更後】<p>テキスト<span class="em-double-circle-open">傍点</span>テキスト</p>
+
+
+■字下げ・インデント / 追加(記載漏れ追加)
+→「class or element」
+
+同区分内の各項目にそれぞれ下記 class を追加
+
+【変更後】
+「字下げ」 :.start-0
+「字上げ」 :.end-0
+「行頭インデント」 :.indent-0
+「突き出しインデント」:.h-indent-0
+
+
+■字下げ・インデント / 変更(記載漏れ追加)
+→「css」
+
+下記項目の「css」を変更
+「字下げ」
+「字上げ」
+「行頭インデント」
+
+【変更前】*em;
+【変更後】[0|*em];
+
+
+■字下げ・インデント / 変更(記載漏れ追加)
+→「突き出しインデント(ぶら下がりインデント)」
+→「css」
+
+【変更前】
+text-indent: -*em;
+【横組み】padding-left: *em;
+【縦組み】padding-top:*em
+
+【変更後】
+text-indent: [0|-*em];
+【横組み】padding-left: [0|*em];
+【縦組み】padding-top: [0|*em];
+
+
+■行や文字の間隔 / 変更(記載漏れ追加)
+→「行高」
+→「css」
+
+【変更前】*;
+【変更後】[normal|*];
+
+
+■行や文字の間隔 / 追加(記載漏れ追加)
+→「文字間」
+→「css」
+
+【変更後】下記を追加
+.lspacing-0
+
+
+■行や文字の間隔 / 変更(記載漏れ追加)
+→「文字間」
+→「css」
+
+【変更前】*[em];
+【変更後】[normal|0|*em];
+
+
+■外側の余白(マージン) / 追加(記載漏れ追加)
+→「class or element」
+
+同区分内の各項目にそれぞれ下記 class を追加
+
+【変更後】
+「四方」 :.m-auto
+「画面上側」:.m-top-auto
+「画面左側」:.m-left-auto
+「画面右側」:.m-right-auto
+「画面下側」:.m-bottom-auto
+「行頭」 :.m-start-auto
+「行末」 :.m-end-auto
+「行前方」 :.m-before-auto
+「行後方」 :.m-after-auto
+
+
+■外側の余白(マージン) / 変更(記載漏れ追加)
+→「css」
+
+同区分内すべての項目の「css」を変更
+
+【変更前】*[em|%];
+【変更後】[auto|0|*em|*%];
+
+
+■内側の余白(パディング) / 変更(記載漏れ追加)
+→「css」
+
+同区分内すべての項目の「css」を変更
+
+【変更前】*[em|%];
+【変更後】[0|*em|*%];
+
+
+■内側の余白(パディング) / 誤植修正
+→「画面下側」
+→「class or element」
+
+【変更前】
+.p-bottop-0
+.p-bottop-*em
+.p-bottop-***per
+
+【変更後】
+.p-bottom-0
+.p-bottom-*em
+.p-bottom-***per
+
+
+■内側の余白(パディング) / 誤植修正
+→「画面下側」
+→「使用例」
+
+【変更前】
+<div class="p-bottop-030per">
+<p>テキスト</p>
+</div>
+
+【変更後】
+<div class="p-bottom-030per">
+<p>テキスト</p>
+</div>
+
+
+■サイズ / 変更(記載漏れ追加)
+→「css」
+
+下記項目の「css」をすべて変更
+
+「高さ」
+「幅」
+「行長方向のサイズ」
+「行幅方向のサイズ」
+
+【変更前】*[em|%];
+【変更後】[auto|*em|*%];
+
+
+■サイズ / 変更(記載漏れ追加)
+→「css」
+
+下記項目の「css」をすべて変更
+
+「高さの最大値」
+「幅の最大値」
+「行長方向の最大サイズ」
+「行幅方向の最大サイズ」
+
+【変更前】*[em|%];
+【変更後】[none|*em|*%];
+
+
+■サイズ / 誤植修正
+→「行長方向のサイズ」
+→「使用例」
+
+【変更前】<p><img class="extent-3em" src="*" alt="*"/></p>
+【変更後】<p><img class="measure-3em" src="*" alt="*"/></p>
+
+
+■罫線 / 変更(記載漏れ追加)
+→「線幅」
+→「css」
+
+【変更前】*[px];
+【変更後】[0|*px|thin|medium|thick];
+
+
+■ブロック要素の位置揃え / 変更
+→「使用例」
+
+同区分内すべての項目の「使用例」をガイド本体にあわせ変更
+
+※下記「***」には各項目の class 名末尾の文字列(「left」等)が入る
+※下記「XXX」には、それぞれ下記の文字列が入る
+ 【横組み】の項目:width
+ 【縦組み】の項目:height
+ それ以外の項目 :measure
+
+【変更前】
+<!-- block only -->
+<div class="block-align-***">
+<div class="XXX-4em">
+<p>テキスト</p>
+</div>
+</div>
+
+【変更後】
+<!-- block only -->
+<div class="XXX-4em block-align-***">
+<p>テキスト</p>
+</div>
+
+
+■色指定 / 誤植修正
+→「1C用文字色」
+→「使用例」
+
+【変更前】<p><span class="silver">テキスト</span></p>
+【変更後】<p><span class="color-silver">テキスト</span></p>
+
+
+■色指定 / 誤植修正
+→「基本文字色」
+→「使用例」
+
+【変更前】<p><span class="red">テキスト</span></p>
+【変更後】<p><span class="color-red">テキスト</span></p>
+
+
+更新履歴
+
[2014/11/01 ver.1.1.3]
----------------------------------------
◎概要
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment