Comment utiliser CSS avec HTML
Le type de média CSS "screen" est principalement destiné à être affiché sur des écrans d'ordinateur et des dispositifs similaires. Lorsque des styles sont définis pour le type de média "écran", ils affectent la manière dont le contenu web est présenté sur les écrans, en mettant l'accent sur la conception visuelle et l'interactivité.
En revanche, le type de média CSS "print" est conçu pour l'impression. Il détermine la manière dont la page web apparaîtra à l'impression, en mettant l'accent sur l'optimisation du contenu pour la page imprimée. Cette optimisation peut inclure l'ajustement de la taille des polices, des marges et la suppression ou le masquage des éléments qui ne sont pas pertinents ou nécessaires lors de l'impression.
Comment utiliser Responsive CSS avec HTML
- Télécharger la bibliothèque C# pour utiliser CSS avec HTML
- Préparer le fichier HTML pour la conversion en PDF
- Spécifier le type de média CSS approprié pour une excellente sortie PDF
- Définissez le type de média CSS sur "Print" pour permettre la répétition de l'en-tête du tableau
- Configurer la largeur et la hauteur de la fenêtre de visualisation de manière indépendante
Installer avec NuGet
Install-Package IronPdf
Installer avec NuGet
Install-Package IronPdf
Commencez à utiliser IronPDF dans votre projet dès aujourd'hui avec un essai gratuit.
Découvrez IronPDF sur NuGet pour une installation rapide et un déploiement facile. Avec plus de 8 millions de téléchargements, il transforme PDF avec C#.
Envisagez d'installer le IronPDF DLL directement. Téléchargez et installez-le manuellement pour votre projet ou sous forme de GAC : {{lienDllAfficher}}
Types de CSS pour l'écran et l'impression (CSS3)
IronPDF génère des PDF à partir de HTML en C# et peut, par défaut, rendre sans effort une feuille de style d'écran en PDF. C'est pratique car les feuilles de style pour l'impression sont souvent moins bien documentées, utilisées ou développées que leurs équivalents pour l'écran.
CSS3 permet à certains styles CSS d'être rendus exclusivement dans les documents imprimés, tandis que d'autres sont destinés aux navigateurs web. IronPDF peut être programmé pour fonctionner avec l'un ou l'autre.
Créer et appliquer une feuille de style d'impression à notre HTML : https://www.jotform.com/blog/css-perfect-print-stylesheet-98272/.
Il est très difficile de dire quel type de média CSS est le meilleur, car chaque type vise des cas d'utilisation différents. Il vaut la peine d'essayer chacun d'entre eux par tâtonnement pour déterminer celui qui répond à vos besoins.
Répéter les en-têtes de tableau
Pour les tableaux HTML qui s'étendent sur plusieurs pages, définissez la propriété CssMediaType sur PdfCssMediaType.Print. Cela permet de s'assurer que l'en-tête du tableau est répété en haut de chaque page étendue. En revanche, PdfCssMediaType.Screen demande au Chrome de n'imprimer les en-têtes qu'une seule fois.
Pour s'assurer que Chrome détecte l'en-tête du tableau, celui-ci doit être entouré d'une balise <théad> étiquette. Rendons le 'tableHeader.html' fichier HTML en PDF pour voir l'effet.
:path=/static-assets/pdf/content-code-examples/how-to/html-to-pdf-responsive-css-table-header.csusing IronPdf;
using IronPdf.Rendering;
ChromePdfRenderer renderer = new ChromePdfRenderer();
// Change the paper size to small
renderer.RenderingOptions.SetCustomPaperSizeinPixelsOrPoints(600, 400);
// Choose screen or print CSS media
renderer.RenderingOptions.CssMediaType = PdfCssMediaType.Print;
// Render HTML to PDF
PdfDocument pdf = renderer.RenderHtmlFileAsPdf("tableHeader.html");
pdf.SaveAs("tableHeader.pdf");Imports IronPdf
Imports IronPdf.Rendering
Private renderer As New ChromePdfRenderer()
' Change the paper size to small
renderer.RenderingOptions.SetCustomPaperSizeinPixelsOrPoints(600, 400)
' Choose screen or print CSS media
renderer.RenderingOptions.CssMediaType = PdfCssMediaType.Print
' Render HTML to PDF
Dim pdf As PdfDocument = renderer.RenderHtmlFileAsPdf("tableHeader.html")
pdf.SaveAs("tableHeader.pdf")
