Как оформить таблицы на последовательных страницах постраничного вывода мультимедиа? - PullRequest
Новая
       32

Как оформить таблицы на последовательных страницах постраничного вывода мультимедиа?

1 голос
/ 19 июля 2010

У меня есть HTML-таблица, подобная этой: 

<div class="report">
    <table>
        <thead>...</thead>
        <tfoot>...</tfoot>
        <tbody>
            <tr class="row-to-style">...</tr>
        </tbody>
        <tbody>...</tbody>
    </table>
</div>

Обратите внимание, что все вышеперечисленные элементы имеют одинаковую структуру.Я хочу, чтобы стиль самого первого ряда tr.row-to-style отличался от других.Каждый элемент будет иметь стиль tr.row-style, но я хочу повлиять только на первую такую ​​строку на странице.Выводом является постраничный носитель, в частности, PrinceXML создает PDF-файлы из исходных файлов xhtml.Это означает, что мы можем использовать расширенные селекторы CSS, кросс-браузерная совместимость не требуется, и нельзя использовать javascript.

Достаточно просто стилизовать целевую строку на первой странице вывода.Я могу использовать: 

table tfoot + tbody tr.row-to-style {...}

Кроме того, если я знаю, сколько людей поместится на странице, я могу сделать что-то вроде: 

table tbody:nth-of-type(4n+1) tr.row-to-style {...}

Но если я не знаюколичество tbody, которые поместятся на странице, как я могу настроить таргетинг на первую?

На выходе, по сути, разделы thead и tfoot повторяются для каждой страницы.Таблицы были разработаны таким образом специально, чтобы воспользоваться этим.Мы допускаем разрывы страниц после текста.Вывод может содержать несколько страниц.

Таким образом, вывод имеет вид псевдо-thead и псевдо-tfoot на каждой странице.Но я не вижу способа использовать такое, чтобы пометить первый элемент на странице.Есть идеи?Спасибо ...

1 Ответ

0 голосов
/ 20 июля 2010

Похоже, что не существует какой-либо документации, в которой говорится о возможности нацеливания css на основе "окна страницы", которое создает @page. Все говорит о том, как @page создает «блок страницы», но ничего не говорит о том, как получить доступ или указать на этот блок страницы для стилизации дочерних элементов на странице. Это все снимки в темноте, не проверенные и, вероятно, недействительные, но, возможно, ... 

@page tbody:first-child tr.row-to-style { styles go here }

Или, может быть, какое-то использование именованных страниц? Как: 

@page nameOfPage {}
tbody:first-child tr.row-to-style {page: nameOfPage; other styles go here}

Или что-то вроде @media, определяющее: 

@page {
    tbody:first-child tr.row-to-style { styles go here}
}

Или, может быть (поскольку я предполагаю, что содержимое создается на каждой странице для thead и tfoot, что теоретически должно располагать thead перед первым tbody каждой страницы): 

thead + tbody tr.row-to-style { styles go here }

Честно говоря, я не ожидаю, что что-то из этого сработает, но вы можете попробовать. Кажется, проблема в том, что реальное tfoot определяется только один раз в верхней части source , и поэтому селекторы css не распознают сгенерированную страницу как существующую в целях стилизации.

...