如何使用CSS计算div中div的总数

Question

有没有办法使用CSS计算div中div的总数？

到目前为止，我已经使用JavaScript开发了一个解决方案。

$('#nextPrev > div').length

但我只是想知道这是否可以通过CSS做到。

Answer 1

您可以使用css counter来计算。请考虑以下html：

<div id="test">
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
</div>
<div id="result"></div>

您可以使用以下css显示计数：

#test {counter-reset:test;}
#test > div {counter-increment:test;}
#result:before {content:counter(test);}

Example