Граница-радиус на элементах списка?

Question

Я хотел бы добавить радиус границы в список элементов, но я не хочу, чтобы к каждому элементу применялся стиль.Прямо сейчас мой стиль имеет нечетные элементы списка с одним цветом, а четные элементы более темного цвета.Когда я применяю border-radius к li, он виден для каждой строки, но я хочу, чтобы к нему применялся только первый элемент и последний элемент.Как я могу сделать это без создания специального идентификатора или класса только для этих двух элементов списка?

Вот мои HTML и CSS:

<section id="list">
<ul>
        <li>Song 1</li>
        <li>Song 2</li>
        <li>Song 3</li>
    </ul>
</section>

ul{
list-style:none;
padding-left:0px;
width:600px;
}

ul li:nth-child(odd){
background: rgba(12,147,0,0.4);
}

ul li:nth-child(even){
background: rgba(12,147,0,0.7);
}

li{
padding:15px;
border-radius: 20px;
}

Answer 1

использование :first-child и :last-child

li:first-child, li:last-child{
    padding:15px;
    border-radius: 20px;
}