问题标签 [css-counter]

我使用 CSS 来计算 HTML 文档中的部分：

结果是：

A节

B节

如何设置计数器的样式以输出用英文书写的数字？

第一节

第二节

我有一个通过 jQuery 的解决方案（使用字符串数组），但我希望只使用 CSS。有没有办法在不使用 JavaScript 的情况下做到这一点？

如何为反向排序列表创建自定义计数器样式：

我发现这个链接完美地描述了如何按升序实现自定义编号。如何修改以下内容以获取反向自定义编号并将其仅应用于特定列表？

上面代码的结果如下图所示。

我正在使用一个自命名的编号列表。如何读取 start-attribute 并使用 CSS 将其添加到计数器？

HTML

CSS

小提琴

我需要在三列、表格、枚举环境中的 HTML 页面中显示一些数据，如下所示：

• 不需要水平或垂直规则。
• 每条数据都在一个左对齐的“框”中，因此如果有任何文本需要换行，它仍然保留在其列中。

是否有一个干净的 HTML 或 CSS 解决方案来呈现枚举的表格环境？

我正在尝试使用 nested 创建一个下拉菜单<ul>，每个菜单都<li>显示一个使用 CSS Counters 生成的数字。

display:none未悬停时隐藏子菜单。

我的问题是当元素display设置为none.

你知道防止这种情况的 CSS 属性吗？

如果我替换display: none为visibility: hidden，它可以工作，但我不确定将它用于我的菜单是否很好，是否有任何陷阱？

我想在悬停时更改列表的内容，即罗马更改为数字 1、2、3

我试过li:hover li:hover:after了，但两者都会用现有内容添加内容

假设我有一个简单的列表，如下所示：

现在我只想用“count”类对列表项进行编号

所以如果我添加CSS：

然后删除没有类的列表项的列表样式类型：

我明白了：

小提琴

这里明显的问题是没有类的列表项也在这里“计数”，只是没有显示。

所以在上面的例子中，列表应该编号为 7 - 编号跳过没有类的列表项。这可以用 CSS 完成吗？

我需要 HTML 来生成类似于以下内容的输出：

我相信由于需要在字母周围加上括号，我不能为此使用有序列表标签。显然它可以用表格来完成，但我更愿意使用 CSS。但是，我不知道如何做到这一点。

如果换行到下一行，它们应该像有序列表一样在文本下继续。

更新我试过

和 HTML，例如：

产生这个

不幸的是，我的要求与原始问题中的完全一致。所以我的 CSS 在这些方面失败了。

1. 在 1 和 2 之后需要有句号，但在 1.1 和 1.2 之后不需要
2. 1 和 1.1 不应该缩进，它们的文本需要对齐到同一个地方。所以 onedotone 这个词需要正好在 one 这个词的下方。此外，数字和文本之间的间距必须大于一个空格。
3. (a) 需要与单词 onedottwo 对齐，并且在 (a) 和 A 之间需要有比一个空格更大的间隙。

padding-left不是答案，因为它无助于排列数字后的文字，你得到

代替

这超出了我的 CSS 能力。除非有人有专业知识为我指明正确的方向，否则我担心我将不得不重新使用桌子。

我的计数器有问题，我用它来获取 h3、h4 和 h5 之前的数字，比如列表。该数字仅在标签具有 class="count" 时才可见，并且只有这样它才应针对下面的标题进行计数器重置。

当我跳过在 h3 上显示数字时，h4s 计数器会变得混乱，跳过 h4 也是如此。有谁知道为什么？

css

html

结果

代码：http: //jsfiddle.net/6gj2r1jd/

以下 CSS 计数器示例未按预期工作。副标题的计数器应在每个主标题后重置：

但是，以下工作按预期工作：

我的问题是，为什么counter-reset在伪元素中不起作用？