На моей странице есть только одно изображение. Вид 1500x3000 px.
В принтере мне нужно, чтобы эта максимальная ширина изображения была шириной страницы, поэтому я сделал: ширина 100% в css, и она работает.
Но высота... старое дерьмо высотой 100% никогда не будет работать. Поскольку он всегда будет на 100% от родительского контейнера, тогда кто-то должен иметь определенную высоту. Или html или тело.
Итак, мой вопрос: сделайте этот образ подходящим на одной странице.
Любые идеи?
Print css: вставить в одну страницу
Ответ 1
Хорошо, извините за то, что "решение" в качестве комментария:
То, что я закончил, предполагало, что 99% клиентов (это правда) используют один размер страницы. Поэтому я помещаю предупреждение в интерфейс печати, который будет работать только с размером страницы "X". очень жаль. но он работает до сих пор
Ответ 2
Один из способов сделать это - выполнить некоторые вычисления, чтобы узнать, какая ширина приведет к тому, что длина будет ровно одной страницей, а затем соответственно установите ширину в CSS.
Ответ 3
Если я понимаю это право, вы могли бы сделать
.OnePageImage { height: 100%; width: 600px; }
Где 600px (ширина) - общая ширина страницы. Тогда изображение будет помещаться на одной странице (хотя и с некоторыми искажениями). Вы также можете добавить стиль разрыва страницы CSS в div до и после изображения, которое выполняется следующим образом:
.break { page-break-after:always; }
Тогда код будет выглядеть так:
<div class="break"></div>
<img src="[your image src]" class="OnePageImage" />
<div class="break"></div>
Ответ 4
Единственное, что ограничивало вывод печати на одну страницу для меня, заключалось в установке высоты в см элемента контейнера, которая завернула всю страницу, а также установила ее переполнение в скрытое. По какой-то причине это, похоже, не работало над элементом body.
body > section {
padding:0 !important;
margin:0 !important;
height:25.7cm !important;
overflow:hidden !important;
}
Кстати, я надеялся, что установка разрыва страницы внутри, чтобы избежать на теле или элемент контейнера, возможно, была решением ограничить одну страницу печати, но это, похоже, не имеет никакого эффекта.