有没有办法根据 nth-child 变量增加 CSS 值? [英] Is there any way to increment a CSS value depending on nth-child variable?

问题描述

这可能是一个长镜头，但它是这样的:

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

我有这个:

<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>

我想要这样的东西:

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

从第二个孩子开始，在 offset = 30px 处添加 35px 到每个孩子.

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

我不想使用 SASS 或其他令人毛骨悚然的东西.

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

推荐答案

鉴于您提供的限制(没有 SASS 或其他令人毛骨悚然的东西)，简单的答案是不，CSS 无法实现.

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

这篇关于有没有办法根据 nth-child 变量增加 CSS 值?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！