gpt4 book ai didi

html-lists - 两列 - 一个有序列表 Jekyll

转载 作者:行者123 更新时间:2023-12-02 15:03:01 25 4
gpt4 key购买 nike

如何在 Jekyll 站点中调整当前的两列(使用 Bootstrap)有序列表?目标是让 Jekyll 获取我的 .md 文件,其中包含有序列表项并将其分成两列。我目前必须单独编辑两列中的每个有序列表,从长远来看这会出现问题,因为该文档会不断更新和添加。

这是我当前的代码:

  <!-- Left Column -->

<div class="col-sm">
<ol>
<li>Zebras</li>
<li>Lions</li>
</ol>
</div>

<!-- Right Column -->

<div class="col-sm">
<ol start="3">
<li>Zebras</li>
<li>Lions</li>
</ol>
</div>

这是我希望通过 Jekyll 完成的视觉效果。

输入(Markdown 文件):

---
layout: default
---

1. Zebras
2. Lions
3. Tigers
4. Gorillas

理想情况下,这将被解析为:

1. Zebras        3. Tigers
2. Lions 4. Gorillas

我发现了两个与主题相关的 StackOverflow 问题,但是都不适合这个用例。 The first使用 YAML front-matter 构建列表。然而,由于我的有序列表中经常有链接,我认为这种方法行不通——而且,与添加每个列表项一样乏味。 The second越来越近了,但是,我认为它使用的是帖子文件,而我使用的是列表项。

我能否让 Jekyll 获取有序列表项的数量,将它们分成两半(或者如果不精确,左列应大于右列),然后将列表项放入各自的列中?最后,从左栏中取出柜台(使用 <ol start="x"> 或其他方式)。

最佳答案

这里有一个想法:使用一列并向其添加 style="column-count: 2"。完毕!

更多 CSS 列选项:https://css-tricks.com/almanac/properties/c/columns/#article-header-id-0

关于html-lists - 两列 - 一个有序列表 Jekyll,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/48351929/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com