.imgDiv
{
text-align:center;
width:100%;
}
.imgDiv img
{
max-width:100%;
margin-bottom:5px;
}
.nodisplay
{
display: none;
}
b
{
font-weight: bold;
font-family: LiberationSerif-Bold, serif;
}
em, i
{
font-family: LiberationSerif-Italic, serif;
}
@font-face
{
font-weight: normal;
font-style: normal;
font-family: LiberationSerif-Regular;
src: url(../Fonts/LiberationSerif-Regular.ttf);
}
@font-face
{
font-weight: bold;
font-style: normal;
font-family: LiberationSerif-Bold;
src: url(../Fonts/LiberationSerif-Bold.ttf);
}
@font-face
{
font-weight: normal;
font-style: italic;
font-family: LiberationSerif-Italic;
src: url(../Fonts/LiberationSerif-Italic.ttf);
}
====================
Приведенный выше файл CSS прошел валидацию успешно. (Да, Вы можете скачать эту таблицу стилей, нажав кнопку Download и пользоваться ей, изменять различные компоненты при необходимости или скопировать отсюда. Вы ничего не нарушаете, это легально, ничего секретного.) Ссылка на онлайн-публикацию:
____________
Как создаётся таблица стилей? Скачивается программа Notepad++. Приведенный выше текст можно скопировать и вставить в редактор. Сохранить введенный текст как таблицу CSS. Я не использую все пункты, включённые в эту таблицу, но мне это не мешает.
Что описывается внутри? На примере заголовка первого уровня (h1)
h1
{
text-align: center; ........ /*заголовок выравнивается по центру*/
page-break-after: avoid; ...... /*запрет на разрыв страницы после заголовка*/
page-break-inside: avoid; ..... /*запрет на разрыв страницы внутри заголовка*/
font-weight: normal; ..... /*тип шрифта – обычный*/
font-size: 1.56em; ...... /*размер шрифта по сравнению с основным текстом (в данном случае 156%)*/
line-height: 1.2em;
margin: 0;
padding: 0;
color: #000080; /*navy*/ .... /*цвет шрифта, в данном примере цвет navy*/
} ...... /*закрывающая фигурная скобка*/
При просмотре кода страницы заголовок будет выглядеть так:
<h1>Заголовок</h1>
, а читатель увидит заголовок синего цвета, с выравниванием по центру страницы.
О единицах измерения: emсоответствует размеру используемого шрифта. К примеру, 2em соответствует удвоенному размеру шрифта. Если используется шрифт 12pt, то 2em будет соответственно 24pt; pt (point)– наименьшая единица измерения в типографском деле, соответствует 1/72 дюйма; px (pixels)– пиксель, точка на экране компьютера. Использование em рекомендовано, т.к. поддерживается масштабирование.
Все теоретические описания могут остаться пустым звуком, потому необходимо взять файл ePub и "разбираться" – просмотреть код, таблицу CSS в редакторе Sigil, многое становится простым и понятным.
Все ли проблемы решаются таким способом? Увы, нет. iBooks (программа чтения на устройствах Apple) не следует спецификациям CSS. Однако, Firefox, Safari и Adobe Digital Editions (ADE), и все ридеры на основе АDE (Sony Reader и Barnes & Noble Nook) работают с CSS.
Каждую таблицу стилей рекомендуется проверить валидатором, например здесь:
http://jigsaw.w3.org/css-validator/
или здесь http://validator.w3.org/
Ну и если речь зашла о валидаторах – онлайн-сервис для проверки готовой книги ePub:
-----------
Думаю, будет интересно ознакомиться с таблицей стилей от mattharrison – epub-css-starter-kit
https://github.com/mattharrison/epub-css-starter-kit/blob/master/css/base.css
Рекомендовано к прочтению (англ.) несколько страничек по форматированию электронных книг на сайте Dr. George Benthien
http://www.gbenthien.net/Kindle%20and%20EPUB/index.html
UPD: Возможно ли использование CSS в книгах формата fb2? Да, об этом есть публикация на форуме
http://maxima-library.org/forum/razdel-predlozhenij/127-stilnye-knigi
-=***=-
Встраивание шрифтов в ePub
abracadabra to
крибле-крабле-бумс...
Съешь ещё этих мягких французских булочек...
Значимость встраиваемых шрифтов.
На многих англоязычных ресурсах уже не один раз встречался с утверждением, что встраивать шрифты в книгу критически-необходимо, если речь идет об иностранных языках. When to embed fonts in ePub filesby Liza Daly:
http://blog.threepress.org/2009/09/16/when-to-embed-fonts-in-epub-files/
Пример отображения книги epub, в которую не встроены кириллические шрифты. Просмотр в Adobe® Digital Editions(попутно замечу, что данная программа у многих создателей книг является эталонной):
Последовательность действий для встраивания шрифтов:
1. Создайте новый файл epub
2. В отдельную папку скачайте и сохраните нужный шрифт (в примере использован шрифт Liberation Serif)
Добавление шрифтов normal, bold, italicв папку Fontsвнутри книги:
3. Добавление в книгу файла CSS (таблица стилей)
Далее продемонстрировано использование таблицы стилей и встроенных шрифтов для отображения форматирования текста в книге.