在 HAML 中启动有序列表答案

【问题标题】：Start Ordered List in HAML在 HAML 中启动有序列表
【发布时间】：2017-01-31 03:11:54
【问题描述】：

试图实现这一点......

<ol start="5">

...但在 HAML 中。

这不起作用：

%ol{:start => "5"}

有什么建议吗？

///以下更新 - 2017 年 2 月 14 日添加///

经过一番挖掘，我发现以前的开发人员已将其添加到 CSS 中：

ol>li {
  margin:0;
  padding:0 0 0 2rem;
  text-indent: -2rem;
  list-style-type:none;
  counter-increment:item;
}

ol>li:before {
  display:inline-block;
  width: 1.5rem;
  padding-right: 0.5rem;
  font-weight:bold;
  font-size: 2.4rem;
  text-align:right;
  content:counter(item) ".";
}

这基本上是删除“正常”列表项计数器并用更大的粗体字体替换它们。这是最初的 UX 设计师的风格选择。

但是，我仍然不确定如何“启动”counter(item)（如果这确实是我应该做的）。

谢谢！

【问题讨论】：

应该可以。你会得到什么？

标签： css html-lists haml css-counter

【解决方案1】：

啊哈 - 那是另一个故事！

list-style-type:none; 关闭列表中的默认 HTML 列表样式。这意味着您的 start 属性根本不会做任何事情。

现在您以前的开发人员正在使用精美的 CSS 来处理列表计数器。阅读更多about counters。 content:counter(item) "."; 打印每个项目的计数器。这段代码中的item 只是计数器的名称。您可能希望在同一页面上有多个计数器。它自然会从 1 开始。您需要做的是重置计数器：

ol {
    counter-reset: item 5;
}

它应该从 5 而不是 1 开始。

【讨论】：