Для того, чтобы добавить тень для каждого второго элемента в блоке «Спасибо что доверяете» и чтобы они были выше остальных блоков, можно воспользоваться CSS-селектором nth-child()
и свойствами box-shadow
и z-index
.
Пример кода:
HTML:
<div class="spasibo-container"> <div class="spasibo-item">Блок 1</div> <div class="spasibo-item">Блок 2</div> <div class="spasibo-item">Блок 3</div> <div class="spasibo-item">Блок 4</div> <div class="spasibo-item">Блок 5</div> </div>
CSS:
.spasibo-container { display: flex; flex-direction: column; } .spasibo-item { padding: 10px; } .spasibo-item:nth-child(2n) { box-shadow: 0 0 5px rgba(0, 0, 0, 0.5); /* добавляем тень */ z-index: 1; /* устанавливаем высший z-индекс */ }
В данном примере мы используем flexbox для создания столбцового расположения блоков spasibo-item
внутри контейнера spasibo-container
.
С помощью CSS-селектора nth-child(2n)
, который выбирает каждый второй элемент, мы добавляем свойства box-shadow
для каждого второго блока, создавая тень. Затем, устанавливаем свойство z-index
для этих блоков, задавая им более высокий индекс, чтобы они были выше остальных блоков.
Вы можете настроить значения box-shadow
и z-index
в соответствии с вашими потребностями.