масштабировать таблицу html перед печатью с помощью css

у меня есть таблица как все содержимое HTML-документа (для законных целей таблицы...это данные таблицы, а не для макета). Некоторые ячейки имеют заданные ширины и высоты (не через css, а используя старый размер, встроенный в структуру таблицы), но общая таблица не имеет заданной ширины или высоты. Это довольно большая таблица, но при правильном масштабировании (около 70%) она может быть напечатана, чтобы хорошо поместиться на одном листе бумаги. Это можно сделать с помощью страницы " масштаб" функция в настройках принтера IE, Firefox и Chrome. Есть ли способ масштабировать всю страницу (которая в моем случае является только этой таблицей) как часть таблицы стилей печати (я знаю о @media print {}, но операторы там игнорируются...проблема заключается в правильных командах для масштабирования, а не в настройке печати css)? Я могу масштабировать экранный вид с помощью этого:

body {
   transform: scale(.7);
}

однако при печати Chrome (и другие) игнорируют мой масштаб и автоматически масштабируют таблицу чтобы соответствовать ширине бумаги, и это приводит к тому, что моя таблица разбивается на вторую страницу. Я попытался применить это также без успеха:

table {page-break-inside: avoid;}
11
css html-table printing-web-page

3 ответов

вы должны использовать типы носителей

@media print {
    body {transform: scale(.7);}
    table {page-break-inside: avoid;}
}

таким образом, эти стили будут применяться только в режиме предварительного просмотра. http://www.w3.org/TR/CSS21/media.html

8

в итоге я переписал всю таблицу с процентными размерами, применяемыми в качестве классов, а затем смог масштабировать страницу для печати. Не уверен, почему браузер игнорировал мои стили печати относительно преобразования, но преобразование таблицы из фиксированных размеров в пропорциональные размеры позволило мне масштабировать ее с помощью CSS, и проблема исчезла.

7

Я знаю, что поднимаю мертвых, но для будущих результатов поиска ссылка:

Я столкнулся с проблемой с супер широкими таблицами, заставляющими все браузеры неправильно вычислять высоту и повторять thead несколько раз на отдельных страницах - мое решение состояло в том, чтобы применить масштабирование: 80% к телу (% зависит от ваших потребностей), что заставило нашу страницу эффективно соответствовать для печати, а затем thead был правильно повторен в верхней части каждой страницы. Возможно, попытка масштабирования будет работать там, где transform нет.

6