JSFiddle - React, Tailwind, and code Playground

HTML

<ul>
    <li>1</li>
    <li>2</li>
    <li>3</li>
    <li>4</li>
</ul>

CSS

body {
    margin: 0;
}
ul {
    margin: 0;
    padding: 0;
    list-style-type: none;
}
li { /* default */
    background-color: #aaa;
    display: block;
    padding: 10px;
    margin: 10px;
}
li+li { /* all but the first */
    background-color: #ff00ff;
}
li+li+li+li { /* sibling override. more specific for the 4th li  */
    background-color: #0000ff;
}
li:nth-child(3){ /* override type 2 */
    background-color: #ff0000;
}