title: Use nth-child as CSS variable
body: <p>Is there some way (without javascript) to make the nth-child affect the CSS?</p>
  
  <p>For example when I have 10 images loaded, I would fade the opacity in, and give each image an animation delay of N seconds.</p>
  
  <p>I can do this manually with nth-child(1){}, nth-child(2){} and so on, but that's obviously messy and has a finite amount of elements.</p>
  
  <p>I have also tried loops and while that works out well for (10n+1), it breaks if i try to stray from the an+b formula (100n+10n). Also I doubt it would work to add 1 second for every n and 10 seconds for every 10n because one of those would overwrite the other.</p>
  
  <p><em>This question is similar to <a href="https://stackoverflow.com/questions/8294400/css-animations-with-delay-for-each-child-element">this one from 2011</a> which is still open but a lot of time has passed and maybe there's a better answer these days.</em></p>