Controlling Text Look and Appearance in HTML
The HTML-to-PDF API endpoint allows you to generate PDF documents from text content. To have more control over the look and appearance of the text, you can insert the text into HTML and utilize CSS. This article will guide you through several ways to achieve this, enabling you to customize the presentation of the text within the generated PDF.
Text Formatting Tags: HTML provides various tags to format text, including:
<strong> or <b> for bold text
<em> or <i> for italic text
<u> for underlined text
<sup> for superscript text
<sub> for subscript text
For example:
<p>This is a paragraph of text.</p>
<p>This is another paragraph.</p>
<p>This is <strong>bold</strong> and <em>italic</em> text.</p>
<p>This is <u>underlined</u> text with <sup>superscript</sup> and <sub>subscript</sub> elements.</p>
<p>This is <strong>bold</strong> text.</p>
<p>This is <em>italicized</em> text.</p>
<p>This is <u>underlined</u> text.</p>
Use heading tags(<h1> to <h6>)
to define different levels of headings:
<h1>This is a Heading 1</h1>
<h2>This is a Heading 2</h2>
And <mark>
, <del>
, <ins>
, and <blockquote>
. These tags can be useful in conveying meaning and applying specific styles to text. For instance:
<blockquote>
<p>This is a blockquote that provides some additional information.</p>
</blockquote>
Inline CSS within HTML tags: One way to control the appearance of the text is by applying inline CSS styles directly within HTML tags. Here's an example:
Note: Use single quotation marks for CSS in JSON API Request e.g '
<p style='font-family: Arial; font-size: 14px; color: #333;'>Your text content here</p>
For granular control over each text element, you can apply inline CSS using the style attribute on individual elements. Here's an example:
<p>Your <span style='font-weight: bold;'>text</span> content here</p>
Remember to experiment with various properties and values to achieve the desired visual outcome. For more information and details visit the HTML documentation.