Встроенный CSS с Pandoc - PullRequest
Новая
       11

Встроенный CSS с Pandoc

0 голосов
/ 22 февраля 2019

Я извиняюсь, если где-то задокументирован простой способ сделать это программно (не копируя / вставляя в поле браузера и не нажимая кнопку конвертации).В своих поисках и чтении я не могу его найти.

Я хотел бы программно превратить файл Markdown и CSS в то, что звучит как «встроенный» CSS. Например:

This Markdownфайл (file.md) 

# Install
Install instructions

## Update
Update instructions

Этот CSS-файл (style.css) 

h1 {
    font-size: 100px;
}

h2 {
    color: red;
}

Становится таким (file.html) 

<h1 style="font-size: 100px;"><a id="install"></a>Install</h1>
<p>Install instructions</p>
<h2 style="color: red;"><a id="update"><a>Update</h2>
<p>Update instructions</p>

Япреобразование Markdown в HTML с помощью Pandoc 

pandoc -f markdown -t html file.md -o file.html

Когда я использую 

pandoc -f markdown -t html file.md -o file.html --css=style.css --self-contained

(или --standalone)

Возвращает 

    <!DOCTYPE html>
    <html xmlns="http://www.w3.org/1999/xhtml" lang xml:lang>
    <head>
      <meta charset="utf-8" />
      <meta name="generator" content="pandoc" />
      <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes" />
      <title>file</title>
      <style type="text/css">
          code{white-space: pre-wrap;}
          span.smallcaps{font-variant: small-caps;}
          span.underline{text-decoration: underline;}
          div.column{display: inline-block; vertical-align: top; width: 50%;}
      </style>
      <style type="text/css">h1 {font-size: 100px;}h2 {color: red;}</style>
      <!--[if lt IE 9]>
        <script src="//cdnjs.cloudflare.com/ajax/libs/html5shiv/3.7.3/html5shiv-printshiv.min.js"></script>
      <![endif]-->
    </head>
    <body>
      <h1><a id="install"></a>Install</h1>
      <p>Install instructions</p>
      <h2><a id="update"><a>Update</h2>
      <p>Update instructions</p>
    </body>
    </html>

Как уже упоминалось выше, это не моя цель.Я хотел бы, чтобы CSS был строго «встроенным»: 

<h1 style="font-size: 100px;"><a id="install"></a>Install</h1>

Кто-нибудь знает об уже написанном инструменте или скрипте, который может программно достичь этого?Я искал и пришел пустым.В идеале я мог бы использовать Pandoc для этого, но я не могу найти способ.

Мне все равно, существуют ли блоки <head> и <style> в HTML или нет.Этот HTML будет отправлен через cURL в систему управления контентом, которая удаляет все элементы HTML, кроме содержимого внутри <body> и любого «встроенного» CSS.

Спасибо за любые мысли или указание в каком-либо направлении.

...