HTML Converter CSS and JavaScript

DynamicPDF HTML Converter supports embedded and external CSS and JavaScript. Use CSS and JavaScript within HTML as you would any other web page.

Embedding CSS and JavaScript

The following example illustrates embedding CSS and JavaScript in an HTML string.

static string samplePageWithCss = "<!DOCTYPE html><html><head ><style>"
  + "body {background-color: lightblue;}"
  + "h1 {color: white; text-align: center;} p "
  + "{font-family: verdana;font - size: 20px;}</style>"
  + "</head><body><h1>My First CSS Example</h1>"
  + "<p>This is a paragraph.</p></body></html>";

Shared samplePageWithCss As String = "<!DOCTYPE html><html><head ><style>" +
  "body {background-color: lightblue;}" +
  "h1 {color: white; text-align: center;} p " +
  "{font-family: verdana;font - size: 20px;}</style>" +
  "</head><body><h1>My First CSS Example</h1>" +
  "<p>This is a paragraph.</p></body></html>"

static string samplePageWithJavaScript = "<!DOCTYPE html><html><body>"
   + "<h2>My First Web Page</h2>"
   + "<p>My First Paragraph.</p><p id=\"demo\"></p>"
   + "<script>document.getElementById(\"demo\")"
   + ".innerHTML = 5 + 6;</script></body></html>";

Shared samplePageWithJavaScript As String = "<!DOCTYPE html><html><body>" +
   "<h2>My First Web Page</h2>" +
   "<p>My First Paragraph.</p><p id=""demo""></p>" +
   "<script>document.getElementById(""demo"")" +
   ".innerHTML = 5 + 6;</script></body></html>"

DynamicPDF HTML Converter seamlessly handles both HTML strings.

Converter.Convert(samplePageWithCss, "cssExample.pdf");
Converter.Convert(samplePageWithJavaScript, "jscriptExample.pdf");

Converter.Convert(samplePageWithCss, "cssExample.pdf")
Converter.Convert(samplePageWithJavaScript, "jscriptExample.pdf")

External CSS and JavaScript Files

DynamicPDF HTML Converter also supports HTML using external files. For example, suppose you have the following HTML file on your local system.

<!DOCTYPE html><html><head>
<link rel="stylesheet" href="../styles.css"/>
</head><body><h1>My First CSS Example</h1>
<p>This is a paragraph.</p></body></html>

DynamicPDF HTML Converter resolves the CSS and applies it to the HTML document's styling before converting into a PDF.

HTML strings with a relative path to a CSS/JavaScript path must use a base path to resolve and apply the file's formatting. See the HTML Converter Base Tags topic for more details.

In this topic