1. IronPDF
  2. Eğitimler
  3. Chrome ile HTML hata ayıklama
HTML'i C# ile PDF'e dönüştürme | IronPDF

How to Debug HTML in Chrome to Create Pixel Perfect PDFs in C

Curtis Chau
Curtis Chau
Güncellendi:
This article was translated from English: Does it need improvement?
Translated
View the article in English

IronPDF'nin geliştiricileri olarak, IronPDF tarafından yapılan PDF belgelerinin sadece mükemmel görünmesi gerektiğini değil, aynı zamanda müşterilerimizin beklentilerine tam olarak uygun görünmesi gerektiğini de anlıyoruz. PDF'lerinizi piksel mükemmelliğinde görünmesi için mükemmel HTML şablonları geliştirmeniz veya bunu sizin için yapacak bir Web Geliştiricisi ile çalışmanız gerekecek. IronPDF, Chrome Renderer'ımız sayesinde PDF'lerinizi HTML'nize Piksel Mükemmelliğinde ve Chrome'da nasıl görüntülendikleriyle tamamen aynı şekilde olacak şekilde görüntüleme seçeneklerine sahiptir.

Hızlı Başlangıç: IronPDF ile Piksel-Mükemmel PDF'ler Oluşturun

IronPDF'nin güçlü Chrome Renderer'ını kullanarak HTML'nizi zahmetsizce piksel-mükemmel PDF'lere dönüştürün. Bu hızlı rehber, HTML5, CSS3 ve JavaScript için IronPDF'nin tam desteğinden yararlanarak kesin ve önceden tahmin edilebilir PDF çıktılarına ulaşmanıza yardımcı olur. Sadece birkaç kod satırı ile HTML içeriğinizi tam olarak Chrome'da olduğu gibi görüntüleyebilir, web'den PDF'e sorunsuz bir geçiş sağlayabilirsiniz. Kullanım kolaylığından ödün vermeden yerleşim doğruluğunu korumayı amaçlayan geliştiriciler için mükemmeldir.

  1. NuGet Paket Yöneticisi ile https://www.nuget.org/packages/IronPdf yükleyin

    PM > Install-Package IronPdf

  2. Bu kod parçasını kopyalayıp çalıştırın.

    var Renderer = new IronPdf.ChromePdfRenderer();
Renderer.RenderingOptions.CssMediaType = IronPdf.Rendering.PdfCssMediaType.Baskı;
Renderer.RenderHtmlAsPdf("<html>Your HTML content here</html>").SaveAs("output.pdf");

  3. Canlı ortamınızda test etmek için dağıtın

    Bugün projenizde IronPDF kullanmaya başlayın ücretsiz deneme ile

    arrow pointer

IronPDF'nin Chrome Renderer'ı nedir?

IronPDF'yi diğer .NET PDF Kütüphanelerinden benzersiz kılar

IronPDF piyasada benzersizdir çünkü Google Chromium Renderer'ını kullanır, yani Chrome tarayıcılarında gördüğünüz HTML, bizim PDF'lerimizde gördüklerinizle tamamen aynı görünecektir. Bu öğreticide, bunu başarmak için Chrome ve IronPDF'ye uygulamanız gereken bazı ayarları anlatacağız.

Açıkça ifade etmek gerekirse, rakipler tarafından uygulanan birçok 'HTML'den PDF'ye' teknolojisi W3C standartlarına uymaz veya hatta HTML5, CSS3 veya JavaScript'i desteklemez ve wkhtmltopdf gibi temel görüntüleyicileri kullanır.

IronPDF Rakiplerle Kıyaslandığında

IronPDF

IronPDF

PDF İndir

Vanilla Chrome

Vanilla Chrome

PDF İndir

Aspose.PDF

Aspose.PDF

PDF İndir

iText

iText

PDF İndir

wkhtmltopdf

wkhtmltopdf

PDF İndir

Diğer ürünlerle tam liste kıyaslaması görmek için, blogumuzu inceleyin.

[pFeatures related to IronPDF Rakiplerle Kıyaslandığında Özellikler] | IronPDF'nin Chrome Renderer'ı | Aspose ve IronPDF | iText and IronPDF

IronPDF'nin Optimize Edilmiş Chrome Renderer'ı Chrome'dan Daha İyidir

IronPDF'nin bizzat Chrome'un kendisinden üstün olduğuna dair iki örnek. Chrome ile aksi halde iki sayfaya bölünmüş olan Düğmeler ve Metinler, IronPDF ile bütün kalır.

Chrome'da Düğmelerin ve Metnin Kesilmesinin Örnekleri

Chrome'da kesik olan düğme, IronPDF'de değil

Chrome'da Metnin Kesilmesinin Başka Bir Örneği

Chrome'da kesik olan metin, IronPDF'de değil

Neden HTML'den PDF'ye Kullanılmalı?

Geliştiriciler, HTML'den PDF'ye dönüştürmeyi sever çünkü mevcut web marka tasarımına tam uyumlu önceden tahmin edilebilir sonuçlar verir. Tasarım iyi belgelenmiş, standartlaştırılmış HTML, CSS ve JavaScript teknolojileri kullanılarak uygulanır.

  • Çıktının yerleşimi ve tasarımı, web sitesiyle tam olarak eşleşir.
  • Web geliştiriciler, mutlak hassasiyetle tasarım yapmaya odaklanabilir.
  • .NET geliştiricileri, yerleşim yerine uygulama mantığına odaklanabilir. Arka uç geliştiricileri, yerleşim ve tasarım görevlerini web tasarımcılarına devredebilir.

1. CSS Medya Türünü Yazdır veya Ekran Olarak Kullanmaya Karar Verin

IronPDF'nin görüntüleyicisi iki medya render etme seçeneğine sahiptir: Baskı (varsayılan) ve Ekran. Görüntülü yan yana karşılaştırma için lütfen bu öğreticinin sonunda "Ekran ve Baskı Örneği Karşılaştırması" bölümünü inceleyin.

  • CssMediaType.Baskı, HTML'nin genel kullanımda bir yazıcı ile uyumlu olmasını optimize eden varsayılan render etme seçeneğidir. Bu, sayfadaki bazı arka plan görüntülerinin, ikonların ve diğer mürekkep ağırlıklı unsurların farklı şekilde görünebileceği veya hariç tutulabileceği anlamına gelir. Bu seçenek arka plan görüntüleri olmayan belgeler için iyidir ve varsayılan baskı önizlemesidir.
  • CssMediaType.Ekran, PDF'lerinizi ekranınızda Chrome içinde göründüğü gibi hazırlayan render etme seçeneğidir. HTML hata ayıklama amacıyla IronPDF'nin tam olarak nasıl görüntüleyeceğini görmek için Chrome tarayıcınızda bazı ayarları yapmanız gerekecek.
:path=/static-assets/pdf/content-code-examples/tutorials/pixel-perfect-html-to-pdf-1.cs
// Pixel Perfect HTML Formatting Settings
IronPdf.ChromePdfRenderer renderer = new IronPdf.ChromePdfRenderer();
renderer.RenderingOptions.CssMediaType = IronPdf.Rendering.PdfCssMediaType.Print; // or Screen
' Pixel Perfect HTML Formatting Settings
Dim renderer As New IronPdf.ChromePdfRenderer()
renderer.RenderingOptions.CssMediaType = IronPdf.Rendering.PdfCssMediaType.Print ' or Screen
$vbLabelText   $csharpLabel

Tekrar Eden Tablo Başlıkları

Birden fazla sayfada yer alacak bir tablo içeren HTML içeriyorsanız, muhtemelen Tablo Başlıklarının her PDF sayfasında tekrarlanmasını istersiniz.

  • Bu durumda, yalnızca Baskı CssMediaType kullanabilirsiniz.
  • Ekran Chrome'a yalnızca üst bilgileri bir kez yazdırmasını talimat verir.

Ekran ve Baskı Örneği Karşılaştırması

Baskı modunda yüklenmeyecek birçok görüntü ve simge, Ekran modunda yüklenecektir:

Baskı 1 Örneği Ekran 1 Örneği

2. Chrome'u Ayarlayın

IronPDF, bir Chrome Görüntüleme Motoru kullanmakla gurur duyar. HTML'nizi Chrome içinde gördüğünüz şekliyle görüntülemek için bu adımları takip edin. Bununla ilgili Chrome'da önceden yapılması gereken birkaç adım vardır.

Baskı formatında genellikle atlanan tüm resimleri, simgeleri ve arka planları içeren Piksel Mükemmelliğindeki PDF'leri oluşturmak için Ekran CSS Medya seçeneğini kullanmayı unutmayın.

2a. DevTools'u açın ve Chrome'da CSS medyası Ekran/Baskı'yı Taklit Et seçeneğini ayarlayın.

  1. Bunu yapmak için, Chrome'da DevTools'u açın.

Chrome'da İncele'yi Kullan

  1. Komut Menüsü'nü açmak için Command+Shift+P (Mac) veya Control+Shift+P (Windows, Linux, ChromeOS) tuşlarına basın. Görüntülemeyi yazmaya başlayın, Rendering'i Göster'i seçin ve Enter'a basın. DevTools, DevTools pencerenizin alt kısmında Rendering sekmesini görüntüler. Daha fazla yardım

Gösterim'i Göster'e gidin ve ardından CSS Medya Tipi'ni bulun

  1. Aşağı ilerleyin ve Emulate CSS media açılır listesini bulun ve Ekran veya Baskı seçeneğini seçin. Bir web sayfasındaysanız, ayarların geçerli olması için sayfayı yeniden yüklemeniz gerekebilir (Ctrl+R).
Switch to CSS Media Type Baskı

Baskı

Switch to CSS Media Type Ekran

Ekran

2b. Baskı Önizleme penceresini açın (Windows'ta Ctrl+P)

Doğru bir görüntü elde etmek için, Chrome Baskı iletişim kutusunda kağıt boyutunu değiştirmeniz ve 'arka plan görüntülerini yazdırmayı' etkinleştirmeniz gerekebilir.

2c. Doğru Baskı Önizleme ayarlarını yapın

  • IronPDF projenizde kullandığınız Kağıt Boyutunu, örneğin A4 veya Letter seçin.
  • Margins açılır listesinin altında Custom seçin ve tüm dört tarafı (1") bir inç kenar boşluğu olarak ayarlayın.
  • Background Graphics onay kutusunu etkinleştirin.
  • Manzara belgeleri oluşturmayı planlıyorsanız Layout ayarınızı Landscape olarak belirlediğinizden emin olun.

Ve hepsi bu kadar. HTML'inizi artık hata ayıklayabilir ve IronPDF'in yerleşiminizi nasıl işleyeceğini tam olarak görmek için baskı önizlemesini kullanabilirsiniz.

3. IronPDF'i Kurun

3a. IronPDF'te CSS Medya Türünü Ayarlayın

Web sayfası tasarımını %100 doğrulukla eşleştirmek için, kodumuzda Chrome'da belirlediğimiz aynı CSS Medya Türünü seçmeliyiz.

Hatırlayın ki PdfCssMediaType.Ekran arka planları ve büyük resimleri içerir ve, yazıcıda mürekkep tasarrufu sağlaması için tasarlanan ve varsayılan olan PdfCssMediaType.Baskı formatında atlanabilir.

:path=/static-assets/pdf/content-code-examples/tutorials/pixel-perfect-html-to-pdf-2.cs
// Example using PdfCssMediaType.Screen
IronPdf.ChromePdfRenderer renderer = new IronPdf.ChromePdfRenderer();
renderer.RenderingOptions.CssMediaType = IronPdf.Rendering.PdfCssMediaType.Screen; // or Print
renderer.RenderingOptions.PrintHtmlBackgrounds = true;
' Example using PdfCssMediaType.Screen
Dim renderer As New IronPdf.ChromePdfRenderer()
renderer.RenderingOptions.CssMediaType = IronPdf.Rendering.PdfCssMediaType.Screen ' or Print
renderer.RenderingOptions.PrintHtmlBackgrounds = True
$vbLabelText   $csharpLabel

3b. Render Gecikmesini ve Render Zaman Aşımını Uygun Şekilde Ayarlama

IronPDF'in varsayılan render zaman aşımı 60 saniyedir. Bu süreden daha uzun süren bir işlem, render seçeneklerini düzenlemeden işlenmeyecektir. Varsayılan ayarları geçersiz kılmak için RenderingOptions.Timeout seçeneğini ayarlamanız gerekecek.

Zaman aşımı ayarlanmadığını veya render gecikmesinin ayarladığınız zaman aşımından daha uzun olduğunu aklınızda bulundurun, bu Unable to Render PDF İstisnasına yol açar. Bu hatayla karşılaşıyorsanız bu değerleri artırmanız gerekebilir.

:path=/static-assets/pdf/content-code-examples/tutorials/pixel-perfect-html-to-pdf-3.cs
// Example of setting Timeout and RenderDelay options
renderer.RenderingOptions.Timeout = 90; // seconds (default is 60)
renderer.RenderingOptions.WaitFor.RenderDelay(30000); // milliseconds
$vbLabelText   $csharpLabel

Başka neler yapabileceğinizi görmek için hazır mısınız? Kılavuz sayfamıza buradan göz atın: Ek Özellikler

Sıkça Sorulan Sorular

HTML'den piksel mükemmeliyetinde PDF oluşturmayı nasıl başarabilirim?

HTML'den piksel mükemmeliyetinde PDF oluşturmak için, IronPDF'in Chrome Renderer'ını kullanabilirsiniz; bu, Chrome tarayıcılarında görüntülenen HTML içeriğinin oluşturulan PDF'lerle aynı olmasını sağlar.

HTML'den PDF'e dönüşüm için IronPDF kullanmanın faydaları nelerdir?

IronPDF, birçok diğer kütüphanenin aksine, HTML5, CSS3 ve JavaScript'i destekleyerek geliştiricilere web tarayıcılarındaki HTML içeriğinin görsel görünümüne uyan PDF'ler oluşturma imkanı verir.

IronPDF'de CSS Medya Türlerini nasıl yapılandırabilirim?

IronPDF'de CSS Medya Türlerini, arka plansız belgeler için 'Baskı'yı veya ekran üzerindeki görünüme uyması için 'Ekran'ı seçerek yapılandırabilirsiniz; böylece PDF çıktısı ihtiyaçlarınıza uygun hale gelir.

Chrome'u PDF işleme için kurmak için hangi adımları izlemeliyim?

Chrome'u PDF işleme için kurmak için, DevTools'u açın, 'CSS medya taklit etme' yi 'Ekran/Baskı'ya etkinleştirin ve PDF'nin istediğiniz düzene uygun olmasını sağlamak için yazdırma önizleme ayarlarını ayarlayın.

IronPDF ile işleme sorunlarını nasıl çözerim?

Eğer 'PDF İşlenemedi' hatası gibi işleme sorunlarıyla karşılaşırsanız, daha iyi sonuçlar için IronPDF ayarlarında İşleme Gecikmesi veya İşleme Zaman Aşımı ayarlarını artırmayı deneyin.

IronPDF'i web tasarımıyla uyumlu PDF'ler oluşturmak için kullanabilir miyim?

Evet, IronPDF Google Chromium Renderer'ını kullanarak tüm modern web teknolojilerini destekleyen, web tasarımınızla birebir uyumlu PDF'ler oluşturmanızı sağlar.

Neden IronPDF Google Chromium Renderer'ı kullanıyor?

IronPDF, Chrome tarayıcılarında görüntülenen HTML'nin oluşturulan PDF'lerle aynı görünmesini sağlamak için Google Chromium Renderer'ı kullanır, böylece tutarlı ve yüksek kaliteli çıktı sağlar.

IronPDF .NET 10 ile uyumlu mu ve yeni .NET 10 projelerinde kullanabilir miyim?

Evet. IronPDF .NET 10'u (aynı zamanda .NET 9, .NET 8 ve öncesi) açıkça destekler ve kutudan çıkar çıkmaz uyumludur. Projelerinizde .NET 10'u hedefleyebilir ve IronPDF'in HTML'den PDF'ye çevirme, işleme, düzenleme ve imzalama API'lerini özel çözümler olmadan kullanabilirsiniz.

Curtis Chau
Curtis Chau
  Mühendislik takımıyla şimdi sohbet edin
Teknik Yazar

Curtis Chau, Bilgisayar Bilimleri alanında lisans derecesine sahiptir (Carleton Üniversitesi) ve Node.js, TypeScript, JavaScript ve React konularında uzmanlaşmış ön uç geliştirme üzerine uzmanlaşmıştır. Kullanıcı dostu ve estetik açıdan hoş arayüzler tasarlamaya tutkuyla bağlı olan Curtis, modern çerç...

Daha Fazlasını Oku
Başlamaya Hazır mısınız?
Nuget Indirmeler 18,332,619 | Sürüm: 2026.4 yeni yayınlandı
Still Scrolling Icon

Hala Kaydiriyor musunuz?

Hızlı bir kanit mi istiyorsunuz? PM > Install-Package IronPdf
bir örnek çalıştır HTML'nizin PDF olduğunu izleyin.