Сделать загрузочный карусельный фон прозрачным - PullRequest
0 голосов
/ 13 октября 2019

Я новичок в CSS, и я хотел сделать прозрачную карусель поверх цветного div, как мне этого добиться?

Ниже приведены мои текущие результаты: enter image description here

Тогда это мой html код:

<div class="second-phase">
        <!-- Tab for Carousel-->
        <div id="products-page-carousel"></div>

        <!--Carousel View-->
        <div id="carousel" class="carousel slide"  data-ride="carousel">

            <!-- The slideshow -->
            <div class="carousel-inner" >
                <div class="carousel-item active" id="my-carousel-bg" >
                    <center>
                        <img src="/media/g01hgi0m/branded-basin.png" alt="Los Angeles" width="30%" height="30%">
                    </center>
                </div>
                <div class="carousel-item" id="my-carousel-bg">
                    <center>
                        <img src="/media/waqd3xdw/branded-milk-crate.png" alt="Chicago" width="10%" height="10%">
                    </center>
                </div>
                <div class="carousel-item" id="my-carousel-bg">
                    <center>
                        <img src="/media/g01hgi0m/branded-basin.png" alt="New York" width="30%" height="30%">
                    </center>
                </div>
            </div>

            <!-- Left and right controls -->
            <a class="carousel-control-prev" href="#carousel" data-slide="prev">
                <img src="/media/aqrnoaxe/asset-1.png" width="17%"/>
            </a>
            <a class="carousel-control-next" href="#carousel" data-slide="next">
                <img src="/media/xqwj1jpx/asset-3.png" width="17%"/>
            </a>
        </div>    
    </div>

Тогда еще и мой CSS здесь:

.second-phase{
    margin-top: -170px;
    height: 700px;
}
#my-carousel-bg{
    background-color: transparent;
    opacity: 2;
}

Вот как мой выводпредполагается:

enter image description here

1 Ответ

0 голосов
/ 13 октября 2019

Вы не можете иметь несколько идентификаторов на одной странице. Они должны быть уникальными во всем документе. Попробуйте изменить идентификатор на класс и посмотрите, решит ли это проблему.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...