Appendix A: Supported HTML tags

HTML renderer přijímá ohraničenou podmnožinu pro rich text, strukturované bloky, tabulky a explicitně namapované obrázky

Parametry

<p>, <br>Odstavce a pevné konce řádků, včetně zastaralých atributů zarovnání a rozestupů odstavců
<h1> through <h6>Tučné nadpisy bloků s klesajícími výchozími velikostmi
<div>, <section>, <article>, <header>, <footer>, <main>Block containers
<blockquote>Obsah odsazeného bloku
<ul>, <ol>, <li>Vnořené nečíslované a číslované seznamy
<b>, <strong>, <i>, <em>Bold and italic text
<sup>, <sub>, <u>Horní index, dolní index, podtržení, dvojité podtržení, přeškrtnutí a nadtržení
<font>, <span>Zastaralé atributy písma, barvy, pozadí, outline, text rendering mode a zaobleného pozadí
<a href="...">Hypertextové odkazy HTTP, HTTPS a file

CSS kaskáda

Rules may appear in <style> elements or inline style attributes

Selektory podporují tag, class, ID, tag.class a kombinace potomků s bílou mezerou; nepodporované selektory atributů, pseudo selektory a kombinátory sourozenců či potomků se ignorují

Odpovídající deklarace se řídí CSS specificitou a pořadím zdroje, inline deklarace mají prioritu a !important se respektuje v rámci podporované podmnožiny

Podporované vlastnosti zahrnují níže vypsané vlastnosti textu, pozadí, fontu, dekorace, zarovnání, line-height, margin, padding, okraje, šířky, výšky, display i svislého zarovnání, plus vlastnosti Flexbox, Grid a poznámek pod čarou v jejich vlastních sekcích

Délky přijímají body, pixely po 0.75 bodu na pixel, jednotky em, procenta i bezjednotkové hodnoty v bodech; velikosti fontů navíc přijímají standardní klíčová slova od xx-small do xx-large

Flexbox

display:flex a display:inline-flex podporují flex-direction, flex-wrap, flex, flex-grow, flex-shrink, flex-basis, justify-content, align-items, align-self, align-content, gap, row-gap a column-gap

Řádkové kontejnery rozdělují kladný i záporný volný prostor na flex řádek, zalomené řádky se měří nezávisle a sloupcové kontejnery rozdělují explicitní nebo z obsahu odvozenou výšku

CSS Grid

display:grid a display:inline-grid podporují grid-template-columns, grid-template-rows, pevné, procentní a fr stopy, jednoduché repeat() a minmax(), grid-column, grid-row, vlastnosti start a end, spans, mezery, automatické umísťování po řádcích či sloupcích a zarovnání jednotlivých položek

Jeden kontejner přijme nejvýš 256 přímých položek a 64 řádků nebo sloupců; vnořený obsah používá stejný HTML renderer i layout cache

Poznámky pod čarou

<footnote>, <aside style="float:footnote"> a <aside role="doc-footnote"> vytvářejí číslované poznámky

Konečné textové boxy vyhradí oblast poznámek dole dřív, než rozloží další řádky těla; reference a poznámka, které se nevejdou spolu, pokračují do dalšího rámu a stav pokračování zachová číslování

Tabulky

<table>, <tr>, <td> a <th> vykreslují změřené řádky s pozadími, odsazením, ohraničením, textovými styly a colspan až do 64 sloupců

Sloupce rozdělí explicitní šířku tabulky nebo dostupnou šířku rovnoměrně, hlavičkové buňky defaultně používají tučný text na světlém pozadí a řádek pokračuje jako jeden atomický celek v dalším HTML textovém boxu

Vnořené tabulky, rowspan, slučování okrajů a automatické určování šířky sloupců podle obsahu nejsou součástí této podmnožiny

Obrázky

<img src="name"> kreslí obrázek, který byl dříve svázán pomocí SetHTMLImage

Vykreslovač podporuje šířku, výšku, okraje, vnitřní odsazení, ohraničení, pozadí a zarovnání vlevo, na střed nebo vpravo; chybějící rozměr zachová přirozený poměr stran a vynechané rozměry používají 0.75 bodu na zdrojový pixel

Zdroje obrázků nikdy nespustí síťový ani souborový přístup, měření neregistruje zdroje a opakované použití znovu použije navázaný image XObject

Meze a obnova

Jeden vstup HTML přijme nejvýše 2048 pravidel stylesheet, 256 bajtů na selektor, 4096 bajtů na blok deklarací, 4096 řádků tabulky a 4096 buněk tabulky

Neznámé vlastnosti, selektory, tagy a atributy se ignorují, zatímco okolní text zůstává zachován; znakové reference se dekódují a vadné zanoření se konzervativně uzavře

Příklad

var
  LogoID: Integer;
begin
  LogoID := PDF.AddImageFromFile('logo.png');
  PDF.SetHTMLImage('brand-logo', LogoID);
  PDF.DrawHTMLTextBox(50, 750, 420, 180,
    '<style>.report h2 { color:#204080; } table { border:1pt solid #808080; }</style>' +
    '<section class="report"><h2>Quarterly report</h2>' +
    '<img src="brand-logo" width="72pt">' +
    '<table><tr><th>Region</th><th>Total</th></tr>' +
    '<tr><td>North</td><td>125</td></tr></table></section>');
end;