傍線部分が違いすぎてどうしたらいいものか。罫囲みと囲み罫でも線の種類によって書かれ方が違いすぎる。
まぁ、面倒そうなのは置いといたままやってみて動作検証をしてみようかと思う。ソニーリーダーやコボはアンドロイドアプリ上で検証することにする。ソニーリーダーのE Ink版とアンドロイド版では表示が異なるそうなので、検証自体が難しいのだけど。
その他のキノッピーとiBookとかグーグルプレイなんかもできたらいいのだけど、ちょっとめんどくさいかな。
超縦書とReadiumなんかでも検証するが、キンドルでの検証が主となりそうだ。電書協に沿ってたら国内向けとコボは大丈夫ではないかとは思っている。
電書協
/* 傍線
---------------------------------------------------------------- */
/* 【横組み】下線 【縦組み】右線 */
.hltr .em-line {
text-decoration: underline;
}
.vrtl .em-line {
text-decoration: overline;
}
/* 【横組み】上線 【縦組み】左線 */
.hltr .em-line-outside {
text-decoration: overline;
}
.vrtl .em-line-outside {
text-decoration: underline;
}
/* 囲み罫
----------------------------------------------------------------
線幅の指定には、罫線と同じものを使用
---------------------------------------------------------------- */
/* 上から実線、点線、二重線、破線 */
.k-solid { border-style: solid solid solid solid; border-width: 1px; border-color: #000000; }
.k-dotted { border-style: dotted dotted dotted dotted; border-width: 2px; border-color: #000000; }
.k-double { border-style: double double double double; border-width: 4px; border-color: #000000; }
.k-dashed { border-style: dashed dashed dashed dashed; border-width: 1px; border-color: #000000; }
/* 線色付き囲み罫（画像枠などに利用） */
.k-solid-black { border-style: solid solid solid solid; border-width: 1px; border-color: #000000; }
.k-solid-gray { border-style: solid solid solid solid; border-width: 1px; border-color: #808080; }
.k-solid-silver { border-style: solid solid solid solid; border-width: 1px; border-color: #c0c0c0; }
.k-solid-white { border-style: solid solid solid solid; border-width: 1px; border-color: #ffffff; }
/* 罫線
----------------------------------------------------------------
線種や線幅など、細かな調整が必要なときは、
無理に既存のクラスを用いず新たにクラスを作成すること
---------------------------------------------------------------- */
/* 線種【実線】 */
.k-solid-top,
.k-solid-right,
.k-solid-bottom,
.k-solid-left,
.k-solid-topbottom,
.k-solid-rightleft {
border-width: 1px;
border-color: #000000;
}
/* 線位置【実線】 */
.k-solid-top { border-style: solid none none none; }
.k-solid-right { border-style: none solid none none; }
.k-solid-bottom { border-style: none none solid none; }
.k-solid-left { border-style: none none none solid; }
.k-solid-topbottom { border-style: solid none solid none; }
.k-solid-rightleft { border-style: none solid none solid; }
/* 線種【点線】 */
.k-dotted-top,
.k-dotted-right,
.k-dotted-bottom,
.k-dotted-left,
.k-dotted-topbottom,
.k-dotted-rightleft {
border-width: 2px;
border-color: #000000;
}
/* 線位置【点線】 */
.k-dotted-top { border-style: dotted none none none; }
.k-dotted-right { border-style: none dotted none none; }
.k-dotted-bottom { border-style: none none dotted none; }
.k-dotted-left { border-style: none none none dotted; }
.k-dotted-topbottom { border-style: dotted none dotted none; }
.k-dotted-rightleft { border-style: none dotted none dotted; }
/* 線種【二重線】 */
.k-double-top,
.k-double-right,
.k-double-bottom,
.k-double-left,
.k-double-topbottom,
.k-double-rightleft {
border-width: 4px;
border-color: #000000;
}
/* 線位置【二重線】 */
.k-double-top { border-style: double none none none; }
.k-double-right { border-style: none double none none; }
.k-double-bottom { border-style: none none double none; }
.k-double-left { border-style: none none none double; }
.k-double-topbottom { border-style: double none double none; }
.k-double-rightleft { border-style: none double none double; }
/* 線種【破線】 */
.k-dashed-top,
.k-dashed-right,
.k-dashed-bottom,
.k-dashed-left,
.k-dashed-topbottom,
.k-dashed-rightleft {
border-width: 1px;
border-color: #000000;
}
/* 線位置【破線】 */
.k-dashed-top { border-style: dashed none none none; }
.k-dashed-right { border-style: none dashed none none; }
.k-dashed-bottom { border-style: none none dashed none; }
.k-dashed-left { border-style: none none none dashed; }
.k-dashed-topbottom { border-style: dashed none dashed none; }
.k-dashed-rightleft { border-style: none dashed none dashed; }
AozoraEpub3
/* 傍線 */
span.underline, span.double_underline, span.dotted_underline, span.dashed_underline, span.wave_underline {
border-right-width: 1px;
padding-right: 1px;
}
span.underline {
border-right-style: solid;
}
span.double_underline {
border-right-width: 3px;
border-right-style: double;
}
span.dotted_underline {
border-right-style: dotted;
}
span.dashed_underline {
border-right-style: dashed;
}
span.wave_underline {
border-right-style: solid;/*wave;*/
}
span.left_underline {
border-left-style: solid;
padding-left: 1px;
border-left-width: 1px;
}
/* 罫囲み */
.border {
border: 1px solid #000;
margin: 0.25em;
padding: 0.25em;
}
/* 破線罫囲み */
.dashed_border {
border: 1px dashed #000;
margin: 0.25em;
padding: 0.25em;
}
