Как из html сделать pdf: Конвертер HTML в PDF. Преобразовывайте HTML-страницы в PDF

HTML в PDF – Конвертировать HTML файлы в PDF

ЗАГРУЗИТЬ

• Grayscale
• Landscape
• No Background
• No Javascript

Перетащите файлы сюда.

Формат HTML является основой всемирной паутины. HTML-файл содержит блоки кода, которые отображают веб-страницу в браузере. HTML играет роль практически во всем в Интернете — от простейших статических страниц до самых сложных веб-приложений.

PDF — это формат файла, используемый для обмена цифровыми документами. PDF-документ обычно содержит текст, изображения и гиперссылки. PDF-файлы также можно просматривать в веб-браузерах, но они не интерактивны, как веб-страницы, и имеют гораздо более ограниченные возможности.

Как правило, HTML-файл представляет собой чертеж веб-страницы, а PDF — снимок документа.

Зачем нужно преобразовывать HTML в PDF?

Большинство файлов HTML мало что делают сами по себе. Они содержат код, который ссылается на другие файлы, будь то изображения, таблицы стилей или даже другие файлы с различными языками кодирования. Если вы поделитесь с кем-то файлом HTML, но не включите в него эти другие элементы, получатель упустит огромную часть визуального восприятия.

Однако если преобразовать HTML-файл в PDF, получатель сможет увидеть факсимиле веб-страницы. Это может быть невероятно полезно для веб-дизайнера, который демонстрирует свою идею клиенту. PDF-файл покажет клиенту, что дизайнер задумал для веб-страницы, не требуя от клиента проходить через сложности, связанные с открытием необработанного HTML-файла.

Как конвертировать HTML в PDF бесплатно?

Наш инструмент позволяет конвертировать HTML-файл в PDF. Вы можете загрузить простой HTML-файл или ZIP-файл, содержащий HTML-код вместе с соответствующими изображениями и таблицами стилей.

Прежде всего, вам нужно решить, как будет выглядеть ваш HTML. На странице есть четыре опции: Grayscale, Landscape, No Background и No JavaScript. Отметив флажок Grayscale, вы получите страницу без цвета; Landscape создаст PDF-страницы в альбомном, а не в портретном режиме; No Background сделает страницу с простым белым фоном; No JavaScript удалит весь JavaScript со страницы.

Обратите внимание, что эти параметры необходимо выбрать до загрузки HTML- или ZIP-файлов. Если вы не установите необходимые флажки перед загрузкой, они не окажут никакого влияния на выводимое содержимое.

После установки необходимых флажков загрузите файлы, нажав кнопку “ЗАГРУЗИТЬ” или перетащив их в поле “Перетащите файлы сюда.”. Наш инструмент автоматически отрендерит HTML и преобразует его в многостраничный PDF.

После завершения преобразования вы можете загрузить новый PDF, нажав кнопку “СКАЧАТЬ” под каждым изображением. Однако вы также можете подождать, пока все преобразования будут завершены, а затем нажать кнопку “СКАЧАТЬ ВСЕ”. Это позволит загрузить все PDF в одном ZIP-архиве.

Вы можете одновременно загрузить до 20 HTML-файлов, ZIP-архивов или их комбинацию. Если вам нужно преобразовать более 20 файлов, вы можете нажать кнопку “ОЧИСТИТЬ” после преобразования и повторить процесс столько раз, сколько потребуется.

Безопасно ли конвертировать HTML в PDF?

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

Конвертируйте HTML в PDF, Web/HTML в PDF онлайн бесплатно с DeftPDF

Конвертируйте HTML в PDF, Web/HTML в PDF онлайн бесплатно с DeftPDF

Преобразовать URL в PDF

Преобразование HTML-файлов

Конвертировать HTML-код

Веб-адреса:

Add multiple URLs, one per line.

Размер страницы:

Одна длинная страница—————-A4A3A2——————БукваЮридический

Ширина видового экрана:

px Текст преобразуется в оттенки серого.

Ориентация страницы:

авто———ПортретПейзаж

Маржа:

ПикселиДюймсантиметрМиллиметр

Автоматическое скрытие уведомлений о файлах cookie

Конвертировать HTML в PDF Дополнительные опции

HTML-код:

Добавьте несколько URL-адресов, по одному на строку.

Размер страницы:

Одна длинная страница—————-A4A3A2——————БукваЮридический

Ширина видового экрана:

px Текст преобразуется в оттенки серого.

Ориентация страницы:

авто———ПортретПейзаж

маржа

ПикселиДюймсантиметрМиллиметр

Автоматическое скрытие уведомлений о файлах cookie

Конвертировать HTML в PDF Дополнительные опции

Как конвертировать HTML в PDF

Ниже мы покажем, как конвертировать веб-страницы в документы PDF

Шаг 1.

Вставьте URL-адреса веб-страниц

Одновременно можно конвертировать несколько веб-страниц. Вставьте каждый URL-адрес в отдельную строку.

Step 2: Save PDF results

ClickConvert HTML to PDFand wait until processing completes. Then press Download and save your PDF documents.

Как добавить ссылку «Сохранить в PDF» на веб-страницу

Позвольте посетителям сохранять веб-страницы в формате PDF

Просто как копирование и вставка

Скопируйте и вставьте приведенный ниже HTML-код и добавьте его на свою веб-страницу:

Подробнее читайте в документации

×

Войдите в свой аккаунт

Зарегистрируйтесь в Google

By logging in with Google you agree to the terms and privacy policy

×

Создать аккаунт

Зарегистрируйтесь в Google

By logging in with Google you agree to the terms and privacy policy

1

Оцените этот инструмент

1 star 2 stars 3 stars 4 stars 5 stars

2. 8 / 5 — 17 votes 5 1

  

Как создать PDF-файл из вашего веб-приложения — Smashing Magazine

• 10 минут чтения
• CSS, Браузеры
• Поделиться в Twitter, LinkedIn

Об авторе

Рэйчел Эндрю — веб-разработчик, писатель и спикер. Она является автором ряда книг, в том числе The New CSS Layout. Она одна из тех, кто стоит за… Больше о Рэйчел ↬

Существует множество вариантов создания PDF-файла из веб-приложения. В этой статье Рэйчел Эндрю рассматривает доступные инструменты и делится своими рекомендациями, которые помогут вам найти инструмент, который лучше всего подходит для вас.

Многие веб-приложения требуют предоставления пользователю возможности загружать что-либо в формате PDF. В случае приложений (таких как магазины электронной коммерции) эти PDF-файлы должны создаваться с использованием динамических данных и быть немедленно доступными для пользователя.

В этой статье я рассмотрю способы создания PDF-файла непосредственно из веб-приложения на лету. Это не исчерпывающий список инструментов, вместо этого я постараюсь продемонстрировать различные подходы. Если у вас есть любимый инструмент или собственный опыт, которым вы хотите поделиться, добавьте его в комментарии ниже.

Начиная с HTML и CSS

Наше веб-приложение, скорее всего, уже создает HTML-документ, используя информацию, которая будет добавлена ​​в наш PDF-файл. В случае счета-фактуры пользователь может просмотреть информацию в Интернете, а затем щелкнуть, чтобы загрузить PDF-файл для своих записей. Возможно, вы создаете упаковочные листы; еще раз, информация уже хранится в системе. Вы хотите отформатировать это в удобном для загрузки и печати виде. Поэтому для начала было бы неплохо подумать, можно ли использовать эти HTML и CSS для создания PDF-версии.

У CSS есть спецификация, касающаяся CSS для печати, и это модуль Paged Media. У меня есть обзор этой спецификации в моей статье «Проектирование для печати с помощью CSS», и многие издатели книг используют CSS для всей своей печатной продукции. Следовательно, поскольку сам CSS имеет спецификации для печатных материалов, мы, конечно же, должны иметь возможность его использовать?

Самый простой способ создать PDF-файл — через браузер. Если выбрать печать в PDF, а не на принтер, будет создан PDF-файл. К сожалению, этот PDF обычно не совсем удовлетворительный! Для начала у него будут верхние и нижние колонтитулы, которые автоматически добавляются при печати чего-либо с веб-страницы. Он также будет отформатирован в соответствии с вашей таблицей стилей печати — при условии, что она у вас есть.

Проблема, с которой мы здесь сталкиваемся, заключается в плохой поддержке спецификации фрагментации в браузерах; это может означать, что содержимое ваших страниц прерывается необычным образом. Поддержка фрагментации неоднородна, как я обнаружил, изучая свою статью «Разрушение блоков с помощью фрагментации CSS». Это означает, что вы, возможно, не сможете предотвратить неоптимальное прерывание содержимого, когда заголовки остаются последним элементом на странице и т. д.

Кроме того, у нас нет возможности контролировать содержимое полей на полях страницы, т.е. добавление заголовка по нашему выбору к каждой странице или нумерация страниц, чтобы показать, сколько страниц имеет сложный счет. Эти вещи являются частью спецификации Paged Media, но не реализованы ни в одном браузере.

Моя статья «Путеводитель по таблицам стилей печати в 2018 году» по-прежнему точна с точки зрения типа поддержки, которую браузеры имеют для печати непосредственно из браузера с использованием таблицы стилей печати.

Больше после прыжка! Продолжить чтение ниже ↓

Печать с использованием механизмов рендеринга в браузере

Существуют способы печати в PDF с использованием механизмов рендеринга в браузере, не заходя в меню печати в браузере и получая верхние и нижние колонтитулы, как если бы вы распечатали документ. Самыми популярными вариантами в ответ на мой твит были wkhtmltopdf и печать с использованием безголового Chrome и Puppeteer.

wkhtmltopdf

Решение, которое несколько раз упоминалось в Твиттере, — это инструмент командной строки под названием wkhtmltopdf. Этот инструмент берет файл HTML или несколько файлов вместе с таблицей стилей и превращает их в PDF. Это делается с помощью механизма рендеринга WebKit.

Мы используем wkhtmltopdf. Это не идеально, хотя, вероятно, это была ошибка пользователя, но вполне достаточно для производственного приложения.

— Paul Cardno (@pcardno) 15 февраля 2019 г.

Таким образом, этот инструмент делает то же самое, что и печать из браузера, однако вы не получите автоматически добавленных верхних и нижних колонтитулов. С этой положительной стороны, если у вас есть рабочая таблица стилей печати для вашего контента, она также должна хорошо выводиться в PDF с помощью этого инструмента, и поэтому простой макет вполне может печатать очень хорошо.

Однако, к сожалению, вы по-прежнему будете сталкиваться с теми же проблемами, что и при печати непосредственно из веб-браузера, с точки зрения отсутствия поддержки спецификации Paged Media и свойств фрагментации, поскольку вы по-прежнему печатаете с использованием механизма рендеринга браузера. Есть несколько флагов, которые вы можете передать в wkhtmltopdf, чтобы добавить обратно некоторые недостающие функции, которые были бы у вас по умолчанию при использовании спецификации Paged Media. Однако это требует дополнительной работы помимо написания хороших HTML и CSS.

Headless Chrome

Еще одна интересная возможность — использование Headless Chrome и Puppeteer для печати в PDF.

Кукольник. Это удивительно для этого.

— Алекс Рассел (@slightlylate) 15 февраля 2019 г.

Однако вы снова ограничены поддержкой браузерами Paged Media и фрагментацией. Есть несколько параметров, которые можно передать в функцию page.pdf() . Как и в случае с wkhtmltopdf, они добавляют некоторые функциональные возможности, которые были бы возможны из CSS, если бы была поддержка браузера.

Вполне возможно, что одно из этих решений сделает все, что вам нужно, однако, если вы обнаружите, что ведете какую-то битву, вполне вероятно, что вы достигаете пределов того, что возможно с текущими механизмами рендеринга браузера. , и нужно будет искать лучшее решение.

Полифиллы JavaScript для Paged Media

Есть несколько попыток по существу воспроизвести спецификацию Paged Media в браузере с помощью JavaScript — по сути, создать Polyfill Paged Media. Это может дать вам поддержку Paged Media при использовании Puppeteer. Взгляните на paged.js и Vivliostyle.

Да. Для простых документов, таких как сертификаты курсов, мы можем использовать Chrome, который имеет минимальную поддержку @ page. Для всего остального мы используем PrinceXML или полифил paged.js в Chrome. Вот подтверждение концепции WIP с использованием paged.js для книг: https://t.co/AZ9fO94PT2

— Electric Book Works (@electricbook) 15 февраля 2019 г.

Использование агента пользователя для печати

Если вы хотите оставайтесь с решением HTML и CSS, тогда вам нужно обратиться к пользовательскому агенту (UA), предназначенному для печати из HTML и CSS, который имеет API для создания PDF из ваших файлов. Эти пользовательские агенты реализуют спецификацию Paged Media и гораздо лучше поддерживают свойства CSS Fragmentation; это даст вам больший контроль над выводом. Основные варианты включают в себя:

• Prince
• Antenna House
• PDFReactor

UA для печати будет форматировать документы с помощью CSS — так же, как это делает веб-браузер. Как и в случае с браузерной поддержкой CSS, вам нужно проверить документацию этих UA, чтобы узнать, что они поддерживают. Например, Prince (с которым я лучше всего знаком) на момент написания статьи поддерживает Flexbox, но не поддерживает CSS Grid Layout. При отправке ваших страниц в инструмент, который вы используете, обычно это будет с определенной таблицей стилей для печати. Как и в случае с обычной таблицей стилей для печати, не все CSS, которые вы используете на своем сайте, подходят для версии в формате PDF.

Создание таблицы стилей для этих инструментов очень похоже на создание обычной таблицы стилей для печати, принимая решения относительно того, что отображать или скрывать, возможно, используя другой размер шрифта или цвета. После этого вы сможете воспользоваться преимуществами спецификации Paged Media, добавляя сноски, номера страниц и т. д.

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

Можно использовать Prince через API, с оплатой за каждый документ, через сервис под названием DocRaptor. Это, безусловно, было бы хорошим местом для запуска многих приложений, поскольку казалось бы, что размещение собственных приложений станет более рентабельным, стоимость разработки переключения будет минимальной.

Бесплатная альтернатива, которая не так универсальна, как вышеупомянутые инструменты, но вполне может дать нужные вам результаты, — это WeasyPrint. Он не полностью реализует весь Paged Media, однако реализует больше, чем движок браузера. Однозначно, стоит попробовать!

Другие инструменты, которые утверждают, что поддерживают преобразование из HTML и CSS, включают PDFCrowd, который смело заявляет о поддержке HTML5, CSS3 и JavaScript. Однако я не смог найти никаких подробностей о том, что именно поддерживалось, и поддерживалась ли какая-либо спецификация Paged Media. Также в ответах на мой твит упоминается mPDF.

Отказ от HTML и CSS

Существует ряд других решений, которые отходят от использования HTML и CSS и требуют от вас создания специального вывода для инструмента. Пара претендентов на JavaScript выглядит следующим образом:

• jsPDF
• pdfmake

Безголовый браузер + сохранение в PDF когда-то был моим первым выбором, но всегда давал некачественные результаты для всего, кроме одностраничного документа. Мы перешли на https://t.co/3o8Ce23F1t для многостраничных отчетов, что потребовало гораздо больше усилий, но в итоге оно того стоило!

— JimmyJoy (@jimle_uk) 15 февраля 2019 г.

Помимо подходов на основе JavaScript, которые требуют от вас создания совершенно другого представления вашего контента для печати, красота многих из этих решений заключается в том, что они взаимозаменяемы. Если ваше решение основано на вызове инструмента командной строки и передаче этому инструменту вашего HTML, CSS и, возможно, некоторого JavaScript, переключаться между инструментами довольно просто.

В ходе написания этой статьи я также обнаружил оболочку Python, которая может запускать ряд различных инструментов. (Обратите внимание, что сами инструменты должны быть уже установлены, однако это может быть хорошим способом протестировать различные инструменты на образце документа.)

Для поддержки Paged Media и фрагментации, Prince, Antenna House и PDFReactor собираются выйти на первое место. Как коммерческие продукты, они также поставляются с поддержкой. Если у вас есть бюджет, сложные страницы для печати в PDF и ваше ограничение — время разработчика, то вы, скорее всего, обнаружите, что это самый быстрый путь к тому, чтобы ваше создание PDF работало хорошо.

Однако во многих случаях вам подойдут бесплатные инструменты. Если ваши требования очень просты, то wkhtmltopdf или базовое безголовое решение для Chrome и Puppeteer может помочь. Это определенно сработало для многих людей, которые ответили на мой первоначальный твит.

Однако, если вы обнаружите, что не можете получить желаемый результат, имейте в виду, что это может быть ограничение печати браузера, а не то, что вы делаете неправильно. В случае, если вам нужна дополнительная поддержка Paged Media, но вы не в состоянии перейти на коммерческий продукт, возможно, обратите внимание на WeasyPrint.

Я надеюсь, что это полезный обзор инструментов, доступных для создания PDF-файлов из вашего веб-приложения. По крайней мере, это демонстрирует, что существует широкий выбор вариантов, если ваш первоначальный выбор не работает.

Пожалуйста, поделитесь своим опытом и предложениями в комментариях, это одна из тех вещей, с которыми многие из нас сталкиваются, и обмен личным опытом может быть невероятно полезным.

Дополнительная литература

Обзор различных ресурсов и инструментов, упомянутых в этой статье, а также некоторых других полезных ресурсов для работы с файлами PDF из веб-приложений.

Технические характеристики

• Модуль страниц 10004
• Фрагментация

Статьи и ресурсы

• Проектирование для печати с CSS
• Breaking Boxes с фрагментацией CSS
• Руководство по состоянию стилей печати. ​​Начатые
• , начатые
• , начатые
• , начатые
• , начатые
• , начатые
• , начатые
• . Headless Chrome и Puppeteer
• print-css.rocks

Инструменты

• wkhtmltopdf
• paged.js
• Vivliostyle
• Prince
• Antenna House
• PDFReactor
• DocRaptor
• WeasyPrint
• PDFCrowd
• mPDF
• jsPDF
• pdfmake
• Produce & Publish Server

How to Generate PDF from HTML in Two Ways

Ivan Cook

• Подано в: Create PDF

Генерация PDF из HTML была сложной задачей, но теперь это можно сделать с помощью как настольных, так и онлайн-решений. Конечный PDF-файл, который вы конвертируете, будет иметь все высококачественные свойства исходного HTML-файла. При использовании правильного инструмента PDF вы можете быть уверены, что ваше преобразование будет выполнено очень легко. Здесь вы увидите два разных способа создания PDF из HTML. Первое — это настольное решение, а последнее — онлайн-решение. Если вы хотите сохранить HTML-страницу в формате PDF, чтобы прочитать ее позже, вам следует использовать эти инструменты.

ПОПРОБУЙТЕ БЕСПЛАТНО

Часть 1. Самый простой способ создания PDF-файла из HTML-файла

Если вы хотите создать PDF-файл из HTML-страницы, вам следует использовать PDFelement Pro, который имеет несколько богатых функций, позволяющих с легкостью преобразовывать файлы. Инструмент может конвертировать несколько различных типов файлов в PDF, так как это в первую очередь редактор PDF.

Как создать PDF из HTML на Mac и Windows

Шаг 1. Импортируйте файл HTML

Загрузите и запустите программу на своем Mac, затем перейдите на страницу приветствия и нажмите «Создать PDF». Это позволит вам выбрать файл HTML из вашей локальной папки. Документ откроется в новом окне.

ПОПРОБУЙТЕ БЕСПЛАТНО

Шаг 2. Редактирование файла

PDFelement Pro позволит вам редактировать новый файл, когда он открыт, как и любой другой файл. Нажмите кнопку «Редактировать», вы можете изменить любой аспект нового файла с помощью нескольких инструментов редактирования PDF.

Шаг 3. Сохранение HTML-файла в PDF

После завершения редактирования файла вы можете выбрать «Файл», а затем «Сохранить как». Это позволит вам выбрать «PDF» в качестве предпочтительного формата. Выберите папку назначения, а затем сохраните ее, чтобы создать PDF из HTML.

---

Почему стоит выбрать PDFelement Pro для создания PDF-файлов из HTML

PDFelement Pro — это профессиональный инструмент для редактирования PDF-файлов, который позволяет не только создавать PDF-файлы из HTML-страниц, но также позволяет создавать PDF-файлы из форматов PPT, Word и изображений. Благодаря расширенной функции OCR вы можете легко редактировать и конвертировать отсканированные PDF-файлы. Этот PDF-редактор сделает вашу работу с PDF-документами намного проще, чем раньше. Ниже приведены некоторые основные функции этого мощного инструмента.

ПОПРОБУЙТЕ БЕСПЛАТНО

Основные функции PDFelement Pro

• Создание и преобразование PDF — этот универсальный инструмент создает файлы PDF с нуля, а также конвертирует файлы нескольких форматов в PDF.
• Создание PDF-форм. Теперь вы можете создавать собственные оригинальные PDF-формы. Вы также можете редактировать другие.
• Цифровая подпись — защитите свою интеллектуальную собственность с помощью этого инструмента для добавления цифровой подписи.
• Простой пользовательский интерфейс — вы можете легко использовать этот инструмент благодаря интуитивно понятному пользовательскому интерфейсу.
• Edit & OCR Scanned PDF — используйте этот инструмент для сканирования печатных материалов, а затем преобразуйте их в цифровые файлы с помощью OCR.

---

Часть 2. Как создать PDF из HTML онлайн

PDFCrowd — отличный онлайн-генератор PDF из HTML, который позволяет выбрать HTML-страницу онлайн и преобразовать ее в высококачественный PDF-документ. Сайт поставляется с расширенными функциями, которые позволяют вам точно указать, каким будет окончательный файл PDF. Этот дополнительный элемент управления отлично подходит для людей, которые хотят создавать высококачественные PDF-файлы со своих веб-сайтов. Если у вас есть портфолио или бизнес-сайт, который вы хотите преобразовать в брошюру в формате PDF, то это лучший онлайн-конвертер для использования. Вы можете конвертировать онлайн-страницы, HTML-файлы на локальном диске, а также HTML-код. Ниже приведен учебник о том, как вы можете использовать его фантастический инструмент.

Как создать PDF-файл из HTML-файла онлайн с помощью PDFCrowd

Это простой трехэтапный процесс Java для создания PDF-файла из HTML.

Шаг 1. Загрузите HTML-файл или веб-страницу

С PDF-массивом вы можете добавить веб-URL, выбрать HTML-файл на своем компьютере или вставить любой HTML-код, и он будет преобразован в PDF.