☰

将 ConTeXt 文档转换为 HTML

tag-icon • tag-icon conversion context html
将 ConTeXt 文档转换为 HTML

对于 LaTeX，我曾经依赖乳胶，latex2html或更罕见的是韓.我知道我们可以使用XML 与 ConTeXt，虽然我没有这方面的经验，潘多克让我们使用 Markdown 语法并提供几种输出格式（包括 ConTeXt 和 (X)HTML）以及模板功能。

但是，是否存在一个现成的 ConTeXt 'tex->html' 转换器，也就是说，它可以接受原始 ConTeXt 文件（可以生成 PDF 文件）并将其转换为 HTML（单页或多页）？

答案1

ConTeXt 不直接输出 XHTML，而是输出 XML。但是当前的浏览器（至少 Opera、Firefox 和 Chromium）能够正确显示 XML。可以使用 CSS 设置 XML 的样式。

如果您想要真正的 XHTML，则必须使用外部工具将 XML 转换为 XHTML。ConTeXt 独立版附带一个示例文件：texmf-context/tex/context/base/export-example.{tex,css}。以下是该文件的修改版和缩短版，用于演示。

% file example.tex

\setupexport      [width=470pt, hyphen=yes]
\setupbackend     [export=example.xml, css=example.css]
\setupbodyfont    [dejavu]
\setupinteraction [state=start]
\setuplayout      [width=middle]
\setupwhitespace  [big]

\definedescription   [description] [width=broad, alternative=hanging]
\definemathalignment [gather]      [n=1,align={middle}]

\starttext

\startchapter [title=Example]

  \startparagraph
    \input ward
  \stopparagraph

  \startparagraph
    You'll find more information on the ConTeXt garden.
      \startfootnote
        The ConTeXt garden is the ConTeXt wiki.
      \stopfootnote
    Another option is to contact the mailing list.
  \stopparagraph

  \startplacefigure [title=Some cows]
    \startcombination[3*1]
      {\externalfigure[cow.png][width=3cm]} {medium}
      {\externalfigure[cow.png][width=4cm]} {large}
      {\externalfigure[cow.png][width=2cm]} {small}
     \stopcombination
  \stopplacefigure

  \startdescription {Ward}
    \input ward
  \stopdescription

  \startformula
    x_{1,2} = \frac{-b \pm \sqrt{b^2 - 4ac}}{2a}
  \stopformula

  \starttabulate [|l|r|p|]
    \NC And \NC here  \NC comes       \NC \NR
    \NC a   \NC table \NC \input ward \NC \NR
  \stoptabulate

\stopchapter

\stoptext

这里是相应的 CSS 文件，负责浏览器中的样式。

/* file example.css */

document {
  font-family  : "DejaVu Serif", serif ;
  font-size    : 12pt ;
  line-height  : 18pt ;
  max-width    : 50em ;
  padding      : 1em ;
}

paragraph, p {
  display       : block ;
  margin-top    : 0.5em ;
  margin-bottom : 0.5em ;
}

section {
  display : block ;
}

sectioncontent {
  display       : block ;
  margin-top    : 1em ;
  margin-bottom : 1em ;
}

section[detail="chapter"], section[detail="title"] {
  margin-top    : 3em ;
  margin-bottom : 2em ;
}

section[detail="chapter"]>sectionnumber {
  display      : inline-block ;
  margin-right : 1em ;
  font-size    : 3em ;
  font-weight  : bold ;
}

section[detail="chapter"]>sectiontitle, section[detail="title"]>sectiontitle {
  font-size   : 3em ;
  font-weight : bold ;
}

description {
  display       : block ;
  margin-bottom : 1em ;
  margin-top    : 1em ;
}

descriptiontag {
  float        : left ;
  clear        : left ;
  margin-right : 1em ;
  text-align   : left ;
  font-weight  : bold ;
}

tabulate {
  display       : table ;
  margin-top    : 1em ;
  margin-bottom : 1em ;
  margin-left   : 2.5em ;
}

tabulaterow {
  display : table-row ;
}

tabulatecell[align="middle"] {
  display       : table-cell ;
  text-align    : center ;
  padding-right : 1em ;
}

tabulatecell[align="flushleft"] {
  display       : table-cell ;
  text-align    : left ;
  padding-right : 1em ;
}

tabulatecell[align="flushright"] {
  display       : table-cell ;
  text-align    : right ;
  padding-right : 1em ;
}

tabulatecell {
  display       : table-cell ;
  text-align    : left ;
  padding-right : 1em ;
}

combination {
  display       : table ;
  margin-top    : 0em ;
  margin-bottom : 0em ;
}

combinationpair {
  display       : table-cell ;
  padding-right : 1em ;
}

combinationcontent {
  display    : table-row ;
  text-align : center ;
}

combinationcaption {
  display     : table-row ;
  padding-top : 1ex ;
  text-align  : center ;
}

float {
  display       : block ;
  text-align    : center ;
  margin-top    : 1em ;
  margin-bottom : 1em ;
  margin-left   : 2.5em ;
}

floatcaption {
  display    : block ;
  margin-top : 0.5em ;
  color      : rgb(60%,60%,0%) ;
}

floatlabel {
  font-weight  : bold ;
  margin-right : 1em ;
}

floatnumber {
  font-weight : bold ;
}

formula {
  display       : block ;
  margin-top    : 1em ;
  margin-bottom : 1em ;
  margin-left   : 2.5em ;
}

sup {
  font-size      : xx-small ;
  line-height    : 0 ;
  vertical-align : top ;
}

以下是 PDF 版本的屏幕截图：

结果-pdf

这是浏览器的截图：

结果-xml

如您所见，样式非常接近。可以通过调整 CSS 文件进一步优化。当然，包含的图形必须以浏览器可以处理的格式呈现。

还存在连字符。ConTeXt0x00AD在可以连字符的地方插入软连字符 ( )，这使浏览器能够对齐段落。

生成的 XML 可以在浏览器和电子书阅读器中显示。但是，并非所有电子书阅读器都兼容，尤其是在数学方面。浏览器在显示数学方面也存在问题。

相关内容