asciidoctor - AsciiDoctor 中的自定义(多列)？

Question

我想布局(也许打印)我的 AsciiDoctor 文档，这是一个主要包含表格的备忘单。

获得多列 HTML 输出并获得多列 PDF 进行打印的最佳方法是什么？

我发现

#col {-moz-column-count: 2;-webkit-column-count: 2;column-count: 2;}

可以在 HTML 中使用 <div> ，但到目前为止我手动修改了 HTML。 (我只是在猜测该怎么做，因为我不是网络开发人员。)

有没有办法在 AsciiDoctor 源文件中包含这种样式和 div？

获得多列 PDF 的最佳方法是什么？

Answer 1

这描述了如何为 HTML 执行此操作。
使用 HTML 输出时，您可以将 CSS 添加为 passthrough-content (++++)。您的示例如下所示:

++++
<style>
#col {-moz-column-count: 2;-webkit-column-count: 2;column-count: 2;}
</style>
++++

然后，您还可以使用直通内容在某些内容周围添加一个 div:

++++
<div id="col">
++++

This

Is 

Multicolumn 

text

++++
</div>
++++

但是要为块分配 ID，您可以以更便携的方式编写

[[col]]
--
This

Is 

Multicolumn 

text
--

如 #col是元素 ID 的 CSS 选择器，使用 CSS 类可能更方便 .col反而。然后你可以有多个具有相同样式的块 - 请注意，现在使用单括号作为块样式而不是上面的双括号作为 ID。

++++
<style>
.col {-moz-column-count: 2;-webkit-column-count: 2;column-count: 2;}
</style>
++++

[col]
--
This

Is 

Multicolumn 

text
--

[col]
--
This

Is 

Multicolumn 

text
--

最后一个片段将产生以下内容: