Is there any way to increment a CSS value depending on nth-child variable?

问题

This is probably a long shot but, here it goes:

I have this:

<style>
    .select-option.hidden:nth-child(2) {
        top: 65px;
    }
    .select-option.hidden:nth-child(3) {
        top: 100px;
    }
    .select-option.hidden:nth-child(4) {
        top: 135px;
    }
    .select-option.hidden:nth-child(5) {
        top: 170px;
    }
    .select-option.hidden:nth-child(6) {
        top: 205px;
    }
</style>

I want something like this:

.select-option.hidden:nth-child(n+2) {
    top: (30+((n-1)*35))px;
}

Starting at the second child and at offset = 30px and adding 35px to every child.

I don´t want to use SASS or other creepy stuff.

回答1:

The simple answer, given the limitations you've provided (no SASS or other creepy stuff), is no, it's not possible with CSS.

来源：https://stackoverflow.com/questions/30918665/is-there-any-way-to-increment-a-css-value-depending-on-nth-child-variable