У вас есть несколько вариантов, сгенерировать блок изолированного кода или необработанный HTML.
Блок огражденного кода
Блок огороженного кода изначально содержит способ присвоения класса блоку кода.Обычно ожидается, что класс будет языком кода, содержащегося в блоке, но это не обязательно.Следовательно, это должно сработать:
{% block output %}
``` nb-output
{{cell.source}}
```
{% endblock output %}
Обратите внимание, что мы установили класс на nb-output
, который будет установлен на теге <code>
HTML (<pre><code class="nb-output">
).
Теперь вы можете определить стиль CSS для класса nb-output
.MkDocs по умолчанию уже включает расширение fenced_code
Markdown.
Необработанный HTML
Как правила * Markdown объясняют :
HTML является публикация формат;Уценка - это запись формат.Таким образом, синтаксис форматирования Markdown решает только те проблемы, которые могут быть переданы в виде простого текста.
В таком случае в Markdown нет механизма для предоставления информации о стилях (или хуков оформления).Однако, поскольку правила продолжаются:
Для любой разметки, не охватываемой синтаксисом Markdown, вы просто используете сам HTML.Нет необходимости вводить предисловие или разделять его, чтобы указать, что вы переходите с Markdown на HTML;вы просто используете теги.
Поэтому в ваш шаблон включите некоторый необработанный HTML.Возможно, что-то вроде этого:
{% block output %}
<div class="nb-output">
{{cell.source}}
</div>
{% endblock output %}
Теперь вы можете определить стиль CSS для класса nb-output
.
Обратите внимание, что поскольку вы не предоставляете вывод (скриншоты не особополезно), я не могу быть уверен, что <div>
- лучший тег для использования.Если вы предоставили сгенерированный HTML для двух примеров, то, возможно, будет более понятно, какой HTML использовать.
Например, обработка Markdown не выполняется внутри блоков исходного HTML.Следовательно, cell.source
не будет преобразован в правильный блок кода.Возможно, лучшим подходом было бы вручную создать блок кода:
{% block output %}
<pre><code class="nb-output">
{{ cell.source|e }}
</code></div>
{% endblock output %}
Обратите внимание, что мы вручную создаем блок кода (оборачивая теги cell.source
в <pre><code>
) при назначении nb-output
класс для блока кода.Мы также экранируем cell.source
с фильтром e
, чтобы обеспечить его правильное отображение в блоке кода.Это все, что обычно делает Markdown при создании блока кода, за исключением класса.