Back
Syntax
Study
Editor
Mode:
HTML
CSS
JavaScript
PHP
Reset
Run »
HTML / CSS / JS
/* Stagger list item transitions */ .list-item:nth-child(1) { transition-delay: 0ms; } .list-item:nth-child(2) { transition-delay: 100ms; } .list-item:nth-child(3) { transition-delay: 200ms; } .list-item:nth-child(4) { transition-delay: 300ms; } .list-item { transition: opacity 0.3s ease, transform 0.3s ease; opacity: 0; transform: translateY(20px); } .list-item.visible { opacity: 1; transform: none; }
Result
Open