CSS – 使用counter()数作为属性的值

前端之家收集整理的这篇文章主要介绍了CSS – 使用counter()数作为属性的值前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
假设我想使用counter()增量根据它的索引增加元素的margin-top.就像是:
div {
    margin-top: calc(counter(myCounter) * 10px);
}

显然上面的方法不起作用,但如果以某种方式可以使用,我找不到任何信息.没有找到表明无法完成的事情,所以我想知道……

由于计数器本质上是由css保留的变量,有什么办法可以使用CSS计数器编号作为属性的值?

编辑

假定的副本(Set margin (indent) based on counter value in CSS)不提供答案,无论是否可能,以及为什么.它只是建议另一种方法.

解决方法

它只能在content属性中工作,而不像你想象的那样变量.如果你在DevTools中查看它,它不是一个整数.你仍然会在那里看到counter(myCounter).

“在CSS 2.1中,计数器的值只能从’content’属性中引用.” source

猜你在找的CSS相关文章