Вы здесьЗнатокам (и любителям) css - новая фича!
Опубликовано сб, 17/12/2011 - 03:24 пользователем golma1
Forums: Возникший недавно разговор о том, что текст книги на сайте выглядит не слишком презентабельно, привёл к новой фиче. Знатокам просьба выложить полученный результат, чтобы и остальные, не слишком искушённые в этом деле, могли воспользоваться результатами.
|
Вход на сайтПоиск по блогам и форумамUser menuПоследние комментарии
kusheyev RE:Правила пользования библиотекой Либрусек 5 часов
babajga RE:На краешке чуда 15 часов konst1 RE:Подайте бедному копеечку на книжку с литреса... 18 часов Саша из Киева RE:Секрет долголетия 1 день s_Sergius RE:Доступ 4 дня serafim68 RE:Заязочка 5 дней Саша из Киева RE:СССР - великое содружество народов-братьев 2 недели weis RE:Прошу переформатировать, распознать, etc... 2 недели Саша из Киева RE:Латинская Америка 2 недели Саша из Киева RE:Сказки старого филина 3 недели Саша из Киева RE:Микроюморески со всего света 3 недели Саша из Киева RE:Звёзды на рейде 3 недели Trinki RE:Цензура в книжном магазине 3 недели Саша из Киева RE:Улицы моего города 3 недели Isais RE:Древний Рим. Подборка книг 3 недели Саша из Киева RE:Обновление FictionBook Editor 1 месяц Саша из Киева RE:Лучезарный феникс 1 месяц PrePress RE:Что случилось с FTP? 1 месяц Впечатления о книгах
дядя_Андрей про Евменов: Охота на вепря (Крутой детектив, Триллер, Детективы: прочее)
27 03 Aleks_Sim, но текст-то оттуда. А обложка, уж больно простецкая. Мне эта больше нравится
Aleks_Sim про Евменов: Охота на вепря (Крутой детектив, Триллер, Детективы: прочее)
27 03 Не надо бы гордо писать ЛИТРЕС, там ведь обложка совсем другая
Дей про Путь Паладина
27 03 В целом понравилось, вполне неплохой образец МС. Особенно если закрыть глаза на рояли и нестыковки. За ГГ можно не переживать, а просто наблюдать, как он уничтожает врагов взмахом руки. Но! Но, блин. Почему он (и иногда другие ………
Belomor.canal про Анонимус: Дело бога Плутоса [litres] (Исторический детектив)
27 03 Затянуто - растянуто, но спустя пару глав мы видим очень живописное описание игрового рая в княжестве Монако, а также динамичные действия с неожиданными ходами и развязкой! Наш статский советник Загорский, как всегда (не ……… Оценка: хорошо
udrees про Карпов: Батый (Биографии и Мемуары)
25 03 Ну насколько это биография Батыя, не знаю, может у других даже этого нету, но книгу можно было назвать типа «монгольская империя и завоевания в 13 веке», «монголы и ханы в 13 веке» и т.д. Большая часть – это описание походов ……… Оценка: неплохо
udrees про Михайлов: Низший 8 [СИ litres] (Боевая фантастика, Героическая фантастика, Киберпанк, Самиздат, сетевая литература)
25 03 Повествование сдвинулось на следующий этап книги после Зомбилэнда. Описание все такое же кровавое и жестокое, отрезанные головы которыми играют в боулинг, вешают на гирляндах, пытки, сражения. Общение тоже жесткое, посыпанное ……… Оценка: отлично!
скунс про Ковтунов: Идеальный мир для Лекаря 14 [СИ] (Боевая фантастика, Юмор: прочее, Самиздат, сетевая литература)
25 03 Читать интересно,хорошая серия Оценка: хорошо
Lan2292 про Бермешев: Альма [СИ] (Боевая фантастика, Городское фэнтези, Самиздат, сетевая литература)
24 03 нравится этот жанр, но тут увы, не смогла читать, очень скучно.
Stanislaw Wartownik про Форчун: Демонический Любовник [The Demon Lover ru] (Мистика)
24 03 Книга неплоха, как и другие произвдения Форчун. Но ПЕРЕВОД просто БЕЗГРАМОТНЫЙ (Видать опять какая школьница из Цахапетовки перепыжилась, или просто сетевой/любительский подстрочник поспешно издали?) А ……… Оценка: неплохо
DGOBLEK про Иевлев: Палящий зной Араксы [СИ] (Боевая фантастика, Космическая фантастика, Попаданцы, Самиздат, сетевая литература)
23 03 Похрен на обложки - он внутри структуру не соблюдает, через онлайн проги конвертит, посмотрите на Йейтса его работа http://fb27.online/b/738328 1) Отсутствует разбивка на сборники - Кельтские сумерки, Истории о Рыжем Ханрахане, ………
alexk про Иевлев: Палящий зной Араксы [СИ] (Боевая фантастика, Космическая фантастика, Попаданцы, Самиздат, сетевая литература)
23 03 Коллеги, а вы заметили, что обложки дядиандрея становятся все более нечитаемыми, или это у меня бревно в глаз попало?
Isais про Николь: Рыцарь золотого веера [Lord of the Golden Fan ru] (Историческая проза, Исторические приключения)
23 03 Тот самый исторический случай, по мотивам которого написан "Сёгун" Клавелла. И снят новый сериал-экранизация. Только в отличие от Клавелла здесь действующие лица названы настоящими именами, больше внимания к личным переживаниям ……… Оценка: хорошо |
Отв: Знатокам (и любителям) css - новая фича!
Я тупо добавил в конец h3.book {text-align : center;} и всё отцентровалось.
Можен надо F5 или CtrlF5?
Отв: Знатокам (и любителям) css - новая фича!
Да. всё забегало нормально:
Отв: Знатокам (и любителям) css - новая фича!
в общем - запутался я. Одну книгу настраиваю - всё настраивается и центровка и цвет и фон:
открываю другую книгу - изменился только фон
http://s017.radikal.ru/i407/1112/f9/da08edba99a0.jpg
Отв: Знатокам (и любителям) css - новая фича!
Если имеется ввиду центрирование заголовков, то там есть нюанс:
В первом случае заголовок:
<h3 class="book">
соответственно, правило
h3.book {text-align : center;}
работает.
Во втором же случае:
<h3 class="title">
и правило на него не распространяется.
Нужно добавить, например:
h3.title {text-align : center;}
Отв: Знатокам (и любителям) css - новая фича!
Точно.
А строка:
h5.subtitle {text-align : center;}
А до этого никак не хотело.
Отв: Знатокам (и любителям) css - новая фича!
Спасибо! забегало!
Отв: Знатокам (и любителям) css - новая фича!
Как уже было отмечено, в книгах, залитых давно, код несколько отличается.
Поэтому, чтобы центрирование заголовков и прочие атрибуты работали и в них, лучше продублировать определения h3.title и h5.subtitle и в виде h3.book и h5.book.
У меня получается примерно так:
H3.title{ font-size : 150%; font-style : normal; font-weight : bold; text-align : center; padding-top : 12px; padding-bottom : 3px;} /* Title */
H3.book { font-size : 150%; font-style : normal; font-weight : bold; text-align : center; padding-top : 12px; padding-bottom : 3px;} /* Title */
H5.subtitle{ font-size : 100%; font-weight : bold; text-align : center; padding-top : 9px; } /* SubTitle */
H5.book { font-size : 100%; font-weight : bold; text-align : center; padding-top : 9px; } /* SubTitle */
Теперь работает и в свежих, и в давних книгах.
Можно еще указать, чтобы подписи авторов в цитатах/эпиграфах/стихах прижимались к правому краю:
blockquote.text-author { text-align : right; padding-right : 50%; }
Отв: Знатокам (и любителям) css - новая фича!
Подскажите как сделать центровку графических вложений?
Отв: Знатокам (и любителям) css - новая фича!
Открыл одну книгу и офигел: картинки по центру. Хотя и не все.
Потом вспомнил. Я в ней в качестве эксперимента вензеля между разделами поместил так:
<subtitle><image l:href="#i_001.jpg"/></subtitle>
Так эти картиночки теперь прекрасно центруются. Как и положено subtitle.
А как со стандартными картинками быть? Не знаю. Но уверен, что знающие люди найдутся.
Отв: Знатокам (и любителям) css - новая фича!
Посмотрел код насчет центрирования графики, - там совсем просто не получится.
Картинки слишком по разному вставлены в книгу.
Как я вижу, обсуждаемый пользовательский css, добавляется последним в head секцию и влияет на всю страницу, в шаблоне для чтения.
Для этой книги http://lib.rus.ec/b/266299/read наиболее универсальным, ИМХО, будет следующий код:
div.clear-block img {margin:10px auto;display:block; }
div.clear-block p img {margin:0;display:inline; }
Первое правило центрирует все картинки, а второе возвращает на место буквицы.
А вот как оно будет работать в других книгах, зависит от форматирования.
Отв: Знатокам (и любителям) css - новая фича!
Пойду переделаю, пока не залил.
Отв: Знатокам (и любителям) css - новая фича!
хотел сделать блочную цитату - не показывает. что не так?
blockquote.style2 {
font: 14px/22px normal helvetica, sans-serif;
margin-top: 10px;
margin-bottom: 10px;
margin-left: 50px;
padding-left: 15px;
border-left: 3px solid #ccc;
}
Отв: Знатокам (и любителям) css - новая фича!
А что за .style2 ? Кто его должен показывать?
Вот обычная цитата из кода со страницы чтения /read:
<blockquote class="cite">
<p class="book" data-n="170">Иже и свято, взойдяше на холмы, подаше книге Воздухе…</p>
</blockquote>
Если переопределить blockquote.cite, то цитата будет выглядеть по-своему. А где используется style2?
Отв: Знатокам (и любителям) css - новая фича!
блин. это жеж его нужно назначить..
Отв: Знатокам (и любителям) css - новая фича!
Ой, а я сдуру решила, что моих скромных познаний в css хватит, чтобы попробовать свои силы.
А тут такие тонкости.
Спасибо знатокам.
Отв: Знатокам (и любителям) css - новая фича!
Прошу оценить наборчик:
<style>
BODY { text-align : justify }
p.book {text-indent: 30px; margin-bottom: 0pt; margin-top: 0pt; text-align : justify; }
H1.book { font-size : 160%; font-style : normal; font-weight : bold; text-align : right; } /* Book title */
H1.title{ font-size : 160%; font-style : normal; font-weight : bold; text-align : right; } /* Book title */
H2.book { font-size : 100%; font-style : normal; font-weight : bold; text-align : center; } /* Author, не используется */
H3.book { font-size : 150%; font-style : normal; font-weight : bold; text-align : center; padding-top : 12px; padding-bottom : 3px;} /* Title */
H3.title{ font-size : 150%; font-style : normal; font-weight : bold; text-align : center; padding-top : 12px; padding-bottom : 3px;} /* Title */
H5.book { font-size : 110%; font-weight : bold; text-align : center; padding-top : 9px; } /* SubTitle */
H5.subtitle{ font-size : 110%; font-weight : bold; text-align : center; padding-top : 9px; } /* SubTitle */
BLOCKQUOTE { margin : 0.2em 4em 0.2em 4em }
DIV.book { text-align : left }
DIV.poem { margin-right : 25%; margin-left : 33%; margin-bottom : 0.8em; margin-top : 0.8em; }
DIV.stanza { margin: 0.8em 0}
BLOCKQUOTE.cite { margin-bottom : 0.2em; margin-top : 0.2em; }
BLOCKQUOTE.epigraph {margin-right : 5em; margin-left : 50%;}
BLOCKQUOTE.text-author { text-align : right; margin-right : 10%; margin-bottom : 0.3em; }
</style>
Заголовки и подзаголовки по центру, стихи тоже смещены к центру, а эпиграфы на правую половину.
Wotti, убери первый вариант, пожалуйста.
Отв: Знатокам (и любителям) css - новая фича!
Очень нравится.
Спасибо.
Отв: Знатокам (и любителям) css - новая фича!
Спасибо! Очень симпатично.
А нельзя ли как-нибудь сделать так, чтобы в самом начале автор и название произведения писались в разных строчках, а не в одной, как это происходит сейчас?
Отв: Знатокам (и любителям) css - новая фича!
Это к Илье.
Тут настройкой стилей не обойтись.
Так сделано в html-коде. Между первой и второй строками нет тега
<br>
, как между остальными.Ну а пока, если это важно, можно делать в fb2 три строки:
• Имя [+Отчество] автора
• Фамилия
• Название книги
upd.
Или так:
• Имя [+Отчество] Фамилия
• пустая строка
• Название книги
Отв: Знатокам (и любителям) css - новая фича!
Я вообще автора и название не вывожу.
Но оно часто встречается в фб2, внутри body.
Зачем - не понимаю.
Верстальщики такие верстальщики.
В принципе можно попытаться выкусывать.
Отв: Знатокам (и любителям) css - новая фича!
Речь идет вот о чем.
В начале fb2 часто идет многострочный title c автором/ми и названием книги. Нужно это или нет, другой вопрос.
Так вот, первая и вторая строка всегда выводятся объединенно. А остальные нормально.
Например в http://lib.rus.ec/b/346079 сам fb2 содержит
Светлана Бестужева-Лада
ТУРЕЦКИЕ СТРАСТИ,
или
Сказка для девушек внешкольного возраста
без комплексов
Светлана Бестужева-Лада ТУРЕЦКИЕ СТРАСТИ,
или
Сказка для девушек внешкольного возраста
без комплексов
Ничего особенного делать и не нужно. Достаточно того, чтобы в генерируемом в html-коде между первой и второй строками тоже стоял тег
<br/>
, как и между остальными. А сейчас его нет, почему-то.<h3 class="title">
<span data-n="5" class="p">Светлана Бестужева-Лада</span>
<span data-n="6" class="p">ТУРЕЦКИЕ СТРАСТИ,</span>
<br/>
<span data-n="7" class="p">или</span>
<br/>
<span data-n="8" class="p">Сказка для девушек внешкольного возраста</span>
<br/>
<span data-n="9" class="p">без комплексов</span>
</h3>
Отв: Знатокам (и любителям) css - новая фича!
А зачем вообще шарашить метаинформацию внутрь body?
Для автора и названия книги есть своё место, и это отнюдь не title.
Отв: Знатокам (и любителям) css - новая фича!
Да кто его знает? Так исторически сложилось. И такой многострочный title (обычно в 2 строки) есть у подавляющего большинства книг. У более, чем 99% — точно. Да и не так важно, что в них содержится, в общем-то. Просто объединение первых двух строк в одну выглядит нелогично и некрасиво. Хотя это ни на что и не влияет, конечно.
Отв: Знатокам (и любителям) css - новая фича!
Не надо обобщать.
Есть масса книг, в которых сначала идёт "Об авторе", "Отзывы в прессе", "Предисловие", а только потом уже сам текст книги, перед которым обязательно должно быть ещё раз её название.
А в других случаях, как правильно сказал s_Sergius, - исторически сложилось. Предполагаю дело в том, что при открытии файла в редакторе названия не видно. Это неэстетично.
Отв: Знатокам (и любителям) css - новая фича!
Кстати, а можно (настройкой в CSS или ещё как) в /b/NNNNN/read перед текстом вывести что-то из description'а - аннотацию, history, ещё что?
Отв: Знатокам (и любителям) css - новая фича!
Добавлю, что БЕЗ заглавия в боди содержание в читалке выглядит так:
С заглавием мне нравится больше:
Отв: Знатокам (и любителям) css - новая фича!
(кто о чём, а вшивый о
бабахбане) А можно заодно как-то подключить встроенные в .fb2-книгу стили / stylesheet?Отв: Знатокам (и любителям) css - новая фича!
можно.
Отв: Знатокам (и любителям) css - новая фича!
И вопрос номер следующий: сделать "библиотечку стилей" - чтобы каждый сделавший CSS мог поделиться им с остальными?
Отв: Знатокам (и любителям) css - новая фича!
update
На странице http://lib.rus.ec/polka/css появилась возможность выбрать уже готовые варианты стилей.
Отв: Знатокам (и любителям) css - новая фича!
Если первую строчку в видоизменить так:
BODY {text-align : justify; background-color: #E2E2E2; }
то цвет фона изменится на серый. Цвет можно поменять: подчёркнутое значение на любое по вашему вкусу. Коды цветов можно взять отсюда http://grafik.offtopic.su/pages/proba
Отв: Знатокам (и любителям) css - новая фича!
Мне кажется, что цвета гораздо проще задавать в таком виде:
color: rgb(0,64,64);
background: rgb(255,240,225);
Так не надо морочиться с шестнадцатеричными значениями. А RGB-значения можно брать как по wotti’ной ссылке: http://grafik.offtopic.su/pages/proba, так и из любого другого источника, где цвет задается в RGB-модели.
Отв: Знатокам (и любителям) css - новая фича!
У меня это не срабатывает в теме bluebreeze. А в других — вполне.
Отв: Знатокам (и любителям) css - новая фича!
Я тут еще немного пошаманил. Вот результат:
/* Основной текст */
BODY { text-align : justify }
p.book {text-indent: 30px; margin-bottom: 0pt; margin-top: 0pt; text-align : justify; }
/* Title */
H3.book, H3.title { font-size : 160%; font-style : normal; font-weight : normal; text-align : center; padding-top : 8px; padding-bottom : 4px; margin: 2px; }
/* Subtitle */
H5.book, H5.subtitle { font-size : 110%; font-weight : normal; text-align : center; padding-top : 6px; padding-bottom : 3px; margin: 2px 30px; }
/* Poem */
DIV.book { text-align : left }
DIV.poem { padding : 6px; margin-right : 30%; margin-left : 30%; }
DIV.stanza { margin: 0.5em 1em }
/* Cite & Epigraph */
BLOCKQUOTE { padding : 5px 10px; font-style: normal; margin : 0.2em 2.5em 0.2em 2.5em }
BLOCKQUOTE.epigraph { padding : 5px 10px; margin-right : 2em; margin-left : 50%;}
BLOCKQUOTE.epigraph DIV.poem { margin-right : 20%; margin-left : 20%; }
/* Text-author */
BLOCKQUOTE.text-author, DIV.poem BLOCKQUOTE.book, BLOCKQUOTE.book BLOCKQUOTE.book, BLOCKQUOTE.epigraph BLOCKQUOTE.book { text-align : right; margin-right : 5%; }
/* Цвета и рамки */
BODY { background: rgb(255,250,240); }
H3.book, H3.title { background: rgb(245,240,255); }
H5.book, H5.subtitle { background: rgb(255,240,240); }
BLOCKQUOTE { background: rgb(250,250,250); border: 2px ridge LightSteelBlue; }
BLOCKQUOTE.cite { color: rgb(0,64,64); }
BLOCKQUOTE.epigraph { color: rgb(0,0,64); }
BLOCKQUOTE.text-author, BLOCKQUOTE.book BLOCKQUOTE.book, BLOCKQUOTE.epigraph BLOCKQUOTE.book { border: none; color: rgb(128,0,64); }
DIV.poem { color: rgb(64,0,0); background: rgb(245,245,245); }
DIV.poem BLOCKQUOTE.text-author, DIV.poem BLOCKQUOTE.book { border: none; color: rgb(128,0,64); background: rgb(245,245,245); }
i{ color: rgb(0,100,0); }
b{ color: rgb(0,0,100); }
Задействовал чуток цвета и рамки. Так как на цвет вообще «товарищей нет», то эти параметры собраны отдельно. Можно настроить их по-своему или просто выкинуть.
Делалось всё для темы bluemarine, но и в bluebreeze, chameleon, garland, marvin, pushbutton тоже работает.
В темах же Simulacrum и minelli, где область чтения и так заужена до безобразия, для стихов может оказаться маловато места, поэтому строки
DIV.poem { padding : 6px; margin-right : 30%; margin-left : 30%; }
BLOCKQUOTE.epigraph DIV.poem { margin-right : 20%; margin-left : 20%; }
Проверять удобно на тестовом файле, добавленном сегодня: http://lib.rus.ec/b/348013/read
Отв: Знатокам (и любителям) css - новая фича!
КАК ЦЕНТРОВАТЬ КАРТИНКИ!!!! )))
Я тоже немного шлифую, скоро выложу (как с картинками разберусь)
Отв: Знатокам (и любителям) css - новая фича!
Тем способом, что написал antonius1980, у меня картинки центрироваться никак не хотели, но если долго мучиться...
Вот эти строки:
img{ margin-right: auto; margin-left: auto; display: block; }
p img, h5 img { margin: 0; display:inline; }
Получается примерно так:
Отв: Знатокам (и любителям) css - новая фича!
!!!!!!
Я добавил подчёркивание субтайтлов и чуть-чуть увеличил расстояние между абзацами, ну и шрифты переназначил:
УПД. Обратил внимание - тебе есть смысл ин-лайны (буквицы) делать в два цвета и на прозрачном фоне
Отв: Знатокам (и любителям) css - новая фича!
А хорошо ли, когда у тебя текст стихов выравнивается по центру?
В некоторых книгах левые отступы играют немаловажную роль, например: http://lib.rus.ec/b/344250/read#t3, а при таком центрировании получится нечто невразумительное.
Отв: Знатокам (и любителям) css - новая фича!
Может быть.. Пробую я. Ищу оптимум
Отв: Знатокам (и любителям) css - новая фича!
Народ, поделитесь табличкой соответствия тэгов в FB2 и HTML! И/или готовым компилятором FB2'шного CSS в HTML'ский, буде таковой существует в природе. Хочу добавить свой fb2.css - выстраданный многолетними экспериментами и оплаченный двумя расколошмаченными e-ink'овыми экранами, - но не знаю как! Да и править чей-то готовый... э... напряжно. :-(
Отв: Знатокам (и любителям) css - новая фича!
Такого соответсвия пока нет.
К концу года постараюсь доделать.