how can I make my carousel change image without javascript

Question

Hello,

I created a carousel with 3 images and wanted to make them change automatically without running a javascript code.

I’ve been searching but everyone recommends using javascript and other ways to change images are not working.

Using the code below I would like to know how to make the images change from 5 in 5 seconds only with html and css.

window.location = "#img1";

.carrossel {
    margin-top: 60px;
}

.carrossel img {
    width: 1280px;
    height: auto;
}

.carrossel .img {
    display: none;
}

.carrossel .img:target {
    display: block;
}

.carrossel .b1 {
    position: relative;
}

.carrossel .b2 {
    position: relative;
}

<main>
        <div class="carrossel">
            <div class="img1 img" id="img1">
                <img src="../img/img_1_car.png" alt="img1">
                <button class="b1"><a href="#img3">Voltar</a></button>
                <button class="b2"><a href="#img2">Avançar</a></button>
            </div>
            <div class="img2 img" id="img2">
                <img src="../img/img_2_car.jpg" alt="img2">
                <button class="b1"><a href="#img1">Voltar</a></button>
                <button class="b2"><a href="#img3">Avançar</a></button>
            </div>
            <div class="img3 img" id="img3">
                <img src="../img/img_3_car.jpg" alt="img3">
                <button class="b1"><a href="#img2">Voltar</a></button>
                <button class="b2"><a href="#img1">Avançar</a></button>
            </div>
        </div>
    </main>