HTML ke PDF

Cara Menukar HTML kepada PDF dalam Tiga Langkah

Langkah pertama, tampal markup anda atau import fail .html yang tersimpan. Markup disusun dalam bingkainya sendiri, berasingan daripada halaman ini, supaya gaya halaman ini tidak bercampur dengan gaya anda. Anda boleh seret dan lepas fail atau mengklik untuk memilihnya daripada peranti.

Langkah kedua, periksa pratonton untuk memastikan rupanya tepat. Pelayar merendernya, lalu setiap halaman PDF akhir menjadi imej PNG daripada hasil render tersebut. Render berjalan pada dua kali saiz akhir, lebih kurang 144 dpi. Cukup untuk skrin dan pencetak pejabat; untuk percetakan komersial pikselnya mula kelihatan.

Langkah ketiga, klik Muat Turun untuk menyimpan PDF terus daripada memori. Alat ini percuma dan selamat: tanpa pemasangan, tanpa pendaftaran, dan HTML anda tidak pernah meninggalkan tab ini. Perlu diketahui sejak awal: teks tidak boleh dipilih, Ctrl+F tidak menemui apa-apa dalam output, dan pembaca skrin tidak mendapat apa-apa.

Bila Imej Menjadi Jawapan yang Tepat

Rasterisasi adalah idea buruk untuk kontrak yang perlu ditelusuri seseorang. Ia berfungsi baik apabila rupa halaman adalah intipatinya.

Menampal Markup Tidak Sama dengan Membuka Fail

Butang Import .html hanya membaca teks daripada fail itu sahaja, tidak lebih. Helaian gaya di sebelahnya, logo di ./images, fon web di ./fonts: tidak satu pun ikut serta, kerana pelayar tidak akan menyerahkan baki cakera anda kepada halaman web.

Laluan relatif gagal secara senyap. Markup anda dirender di sini, bukan di folder tempat fail disimpan, supaya src="logo.png" dibaca relatif terhadap oxygenpdf.com lalu tidak menemui apa-apa. URL https:// mutlak dimuatkan asalkan pelayan mengembalikan pengepala CORS.

Skrip tidak pernah berjalan. Markup yang ditambahkan dengan cara ini tidak menjalankan tag skripnya, supaya aplikasi satu halaman yang disimpan daripada pelayar tampil hampir kosong. Yang anda simpan ialah cengkeramanya, bukan hasil rendernya. Salin DOM hidup daripada pemeriksa elemen lalu tampal itu sebagai gantinya. Yang terbawa dengan pasti hanyalah yang berdikari: blok gaya di dalam fail, atribut gaya sebaris, dan imej yang ditulis sebagai data URI.

Perbandingan

Tiga cara memasukkan HTML ke PDF, lengkap dengan kekurangan masing-masing.

Perkara yang Bertahan, dan Tempat Halaman Terpotong

Warna, gradien, bingkai, sudut membulat, bayang kotak, kelegapan, transformasi CSS, bayang teks, jadual, senarai dan SVG sebaris semuanya terbawa. Perender melukis semula setiap kotak sendiri dan bukannya meminta tangkapan skrin daripada sistem pengendalian, supaya segelintir kesan baharu yang tidak punya padanan langsung digugurkan tanpa amaran: penapis dan blur()-nya, mix-blend-mode, backdrop-filter, clip-path dan topeng.

Markup anda disusun dalam viewport selebar lebih kurang 515 piksel, iaitu lebar kandungan A4 yang diukur dalam piksel CSS. Jadi halaman responsif dirender pada titik putus sempitnya, dan peraturan @media (min-width: 768px) tidak pernah menyala. Jika susun atur anda hanya kelihatan betul di atas 768 piksel, di sini ia tidak akan kelihatan betul.

Imej akhir yang memanjang dipotong menjadi kepingan-kepingan setinggi halaman pada selang tetap. Pemotongannya mekanikal dan tidak mengambil kira isi di bawahnya, supaya baris jadual atau tajuk boleh mendarat separuh pada satu halaman dan separuh pada halaman berikutnya. Peraturan page-break-inside CSS tidak membantu; tolak elemen yang janggal melepasi sempadan dengan margin tambahan atau pengatur kosong. Lebih kurang 762 mata kandungan muat pada setiap halaman.

HTML Anda Tidak Pernah Meninggalkan Tab Ini

Setiap penukar sisi pelayan memerlukan markup anda pada mesinnya. Sama ada anda menampalkannya ke borang lalu memuat naiknya, atau anda memberikan URL lalu perayapnya mengambil halaman — untuk kandungan di sebalik log masuk, cara kedua bermakna menyerahkan kelayakan juga. Kedua-duanya bukan pertukaran yang selesa untuk skrin penuh nama pelanggan.