HTML سے PDF پرنٹر

استعمال کا طریقہ 3 مراحل
  1. HTML مارک اپ چسپاں کریں میں اپنا کوڈ چسپاں کریں۔
  2. صفحے کا پیش منظر دیکھیں۔
  3. HTML کو PDF میں پرنٹ کریں دبائیں اور پرنٹ ونڈو میں Save as PDF چنیں۔

پیش منظر

HTML سے بنی PDF

یہ ٹول کیسے کام کرتا ہے

مارک اپ نئے ٹیب میں ایک خالی صفحے پر لکھا جاتا ہے اور آپ کے براؤزر کے پرنٹ ڈائیلاگ کے حوالے کر دیا جاتا ہے، چنانچہ PDF وہی انجن بناتا ہے جو کوئی بھی ویب صفحہ پرنٹ کرتا ہے۔ یہی چیز اسے واقعی صلاحیت دیتی ہے — اصل متن، سرایت شدہ فونٹ، کام کرتی CSS — اور اسی کا مطلب یہ بھی ہے کہ صفحہ آپ کے مارک اپ کے سوا خالی شروع ہوتا ہے۔

انلائن style خصوصیات اور آپ کے چسپاں کیے گئے مارک اپ کے اندر موجود کوئی بھی style عنصر لاگو ہوتا ہے۔ بیرونی اسٹائل شیٹ حاصل نہیں کی جاتی، اس لیے کسی منسلک CSS فائل پر منحصر مارک اپ بغیر آرائش کے پہنچتا ہے۔ تصویروں کے نسبتی راستے حل نہیں ہو سکتے، کیونکہ صفحے کا اپنا کوئی پتہ نہیں جس کے مقابل انہیں حل کیا جائے؛ مکمل پتوں والی تصاویر معمول کے مطابق آ جاتی ہیں۔

ویب صفحے کو کاغذ پر ٹھیک چلانا

  • CSS ساتھ لے کر آئیں: قواعد کو مارک اپ کے ساتھ ایک style عنصر میں چسپاں کریں۔ جو صفحہ براؤزر میں درست لگے اور یہاں سادہ، اس کی وجہ تقریباً ہمیشہ اس کی گمشدہ منسلک اسٹائل شیٹ ہوتی ہے۔
  • پس منظر کے گرافکس آن کریں: رنگ، سایہ اور پس منظر کی تصاویر پرنٹ ڈائیلاگ میں بطور طے شدہ بند ہوتے ہیں، اسی لیے آراستہ صفحہ سفید پر خالی متن کی صورت چھپ سکتا ہے۔
  • صفحات کے وقفے خود طے کریں: page-break-inside، page-break-before اور page-break-after خصوصیات آپ کے اختیار میں ہیں، اور صفحے کے آخر میں پھنسی ہوئی سرخی کا جواب یہی ہیں۔
  • وہی مارک اپ چسپاں کریں جس پر بھروسہ ہو: آپ کے چسپاں کیے گئے مارک اپ کے اندر موجود کوئی بھی اسکرپٹ نئے ٹیب میں چلتی ہے، بالکل ویسے ہی جیسے کسی صفحے پر جانے پر۔ نامعلوم ذریعے سے نقل کیا گیا مارک اپ بے ضرر نہیں ہوتا۔

Printing is a rendering mode, not an afterthought

Browsers have always been able to turn a page into paper, and for the last decade they have been able to turn it into a PDF instead. The engine doing that is the same one that lays out the page on screen, which is why the output is a proper document: real text, embedded fonts, selectable and searchable.

So converting HTML to PDF is not really a conversion. It is asking the browser to lay the markup out for a page-shaped medium rather than a screen-shaped one, and then saving what it produces.

The [msm_tool slug="html-to-pdf"] takes markup you paste, renders it in a new tab and opens the print dialogue. Choosing Save as PDF as the destination writes the file. Nothing is uploaded; it never leaves your browser.

What paste actually gets you

The markup is rendered with a plain sans-serif base and nothing else, which is the important thing to understand before pasting a page from a live site.

External stylesheets do not come. A fragment lifted from a styled site arrives unstyled, because the CSS that made it look like anything lives in a file you did not paste. The same goes for images referenced by relative paths, web fonts, and anything a script was going to build after load.

What does work: a self-contained fragment. Inline styles, or a <style> block pasted alongside your markup, are honoured. Absolute image URLs load. Tables, lists and headings render properly as themselves, which is the main reason to reach for HTML here rather than plain text — a real table stays a real table.

Two settings in the dialogue

Headers and footers off. Otherwise the browser stamps the page title, the URL, the date and a page number on every sheet.

Background graphics on, if your markup uses them. This one is off by default, which is why a document with coloured table rows, tinted panels or a dark header prints as plain white and looks broken. It is the single most common surprise in browser-generated PDFs.

Paper size and margins are worth a glance too, particularly if the document is going somewhere that uses different paper from you.

Writing markup for paper

Screen layout assumptions stop being true on a page, and a few habits avoid most of the damage.

  • Avoid fixed pixel widths. A container set to 1200 pixels does not fit a page and gets scaled or clipped. Let content flow.
  • Set sizes in points for print. Paper has real physical dimensions in a way a screen does not.
  • Assume no colour. Much of what is printed goes through a black-and-white machine, and pale grey text on white becomes invisible.
  • Links need their addresses. A clickable "read more" means nothing on paper. Spell the URL out, or accept that the link is decorative.

The print stylesheet you can use

CSS has real page-control rules, and a <style> block pasted with your markup can use them. page-break-before and page-break-after force a break at a chosen element, which is how you keep each section starting on a fresh page. page-break-inside: avoid keeps a table or a figure from splitting across two pages.

Wrapping those rules in @media print is the tidy way to do it, though when the markup exists only to be printed, applying them directly is simpler. Either way, this is the answer to the commonest complaint about browser-made PDFs — that page breaks land badly. They land where you did not tell them not to.

When to reach for something else

This route suits a self-contained fragment: an invoice, a table of data, a formatted letter, a report section. It is quick, it is private, and the output is a genuine text-based PDF.

It does not suit generating documents at scale or on a server, where a headless browser driven by a script is the standard approach and gives repeatable output. It does not suit rendering a whole live web page, where saving the page from the browser itself keeps the stylesheets. And it does not suit anything needing precise typographic control, which is what a typesetting system is for.

Read the preview before saving

The preview panel shows the real pagination. Look for a table cut across a break, a heading stranded at the foot of a page, and any element that came out unstyled because its CSS stayed behind. All three are fixable in the markup, and all three are far cheaper to fix now than after the document has gone out.

اکثر پوچھے گئے سوالات

خاص طور پر HTML سے PDF پرنٹر کے بارے میں۔ اس زمرے سے متعلق عمومی سوالات کے جواب زمرے کے صفحے پر موجود ہیں۔

سب سے عام وجہ بیرونی اسٹائل شیٹ ہے، جو حاصل نہیں کی جاتی۔ قواعد کو چسپاں کیے جانے والے مارک اپ کے اندر ایک style عنصر میں نقل کریں۔
نسبتی راستوں کے پاس حل کرنے کو کچھ نہیں، کیونکہ صفحہ صرف آپ کے مارک اپ سے بنتا ہے۔ اس کے بجائے مکمل پتے استعمال کریں۔
اس عنصر پر page-break-inside کو avoid پر مقرر کریں۔ پرنٹ انجن صفحات کے وقفوں کی خصوصیات کا لحاظ رکھتا ہے، چنانچہ کاغذ پر ساخت آپ کے قابو میں ہے۔
نہیں۔ مارک اپ آپ کے براؤزر میں پیش ہوتا ہے اور آپ ہی کا براؤزر اسے پرنٹ کرتا ہے۔ کچھ آپ کی مشین سے باہر نہیں جاتا۔
پرنٹ ڈائیلاگ میں، اور CSS میں page قاعدے کے ذریعے۔ ڈائیلاگ کی اپنی ترتیبات کو فوقیت حاصل ہے، اس لیے محفوظ کرنے سے پہلے انہیں دیکھ لیں۔

نئے ٹولز، خصوصیات اور کارکردگی بڑھانے کے مشوروں کی اطلاع پانے کے لیے سبسکرائب کریں۔