javascript — я хочу сделать наполовину изображение карусели наполовину, а когда я добавляю netx, меняю картинку и текст

Я хочу сделать наполовину изображение карусели наполовину, а когда я добавлю netx, поменяю картинку и текст

Я хочу сделать так на картинке

Вот подсказка моего кода. введите код сюда

Кто-нибудь знает, как я могу сделать, как на картинке? я так хочу этого

  {amp}lt;div class="py-5 bg-light" id="venue" {amp}gt; {amp}lt;div class="container"{amp}gt; {amp}lt;div class="row bg-dark p-4"{amp}gt; {amp}lt;div class="p-0 col-md-6"{amp}gt; {amp}lt;div class="carousel slide" data-ride="carousel" id="carousel1"{amp}gt; {amp}lt;div class="carousel-inner" role="listbox"{amp}gt; {amp}lt;div class="carousel-item active"{amp}gt; {amp}lt;img class="d-block img-fluid w-100" src="assets/restaurant/venue_1_light.jpg" atl="first slide"{amp}gt; {amp}lt;/div{amp}gt; {amp}lt;div class="carousel-item"{amp}gt; {amp}lt;img class="d-block img-fluid w-100" src="assets/restaurant/venue_3_light.jpg" data-holder-rendered="true"{amp}gt; {amp}lt;/div{amp}gt; {amp}lt;div class="carousel-item"{amp}gt; {amp}lt;img class="d-block img-fluid w-100" src="assets/restaurant/venue_2_light.jpg" data-holder-rendered="true"{amp}gt; {amp}lt;/div{amp}gt; {amp}lt;div class="carousel-item"{amp}gt; {amp}lt;img class="d-block img-fluid w-100" src="assets/restaurant/venue_4_light.jpg" data-holder-rendered="true"{amp}gt; {amp}lt;/div{amp}gt; {amp}lt;/div{amp}gt; {amp}lt;a class="carousel-control-prev" href="#carousel1" role="button" data-slide="prev"{amp}gt; {amp}lt;span class="carousel-control-prev-icon" aria-hidden="true"{amp}gt;{amp}lt;/span{amp}gt; {amp}lt;span class="sr-only"{amp}gt;Previous{amp}lt;/span{amp}gt; {amp}lt;/a{amp}gt; {amp}lt;a class="carousel-control-next" href="#carousel1" role="button" data-slide="next"{amp}gt; {amp}lt;span class="carousel-control-next-icon" aria-hidden="true"{amp}gt;{amp}lt;/span{amp}gt; {amp}lt;span class="sr-only"{amp}gt;Next{amp}lt;/span{amp}gt; {amp}lt;/a{amp}gt; {amp}lt;/div{amp}gt; {amp}lt;/div{amp}gt; {amp}lt;div class="p-4 col-md-6 bg-light"{amp}gt; {amp}lt;p class="m-0"{amp}gt;Feel comfortable, like home{amp}lt;/p{amp}gt; {amp}lt;h2{amp}gt;Discover the venue{amp}lt;/h2{amp}gt; {amp}lt;p class="my-4"{amp}gt;Design and architecture go together with good food. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. {amp}lt;br{amp}gt; {amp}lt;br{amp}gt;Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. {amp}lt;br{amp}gt; {amp}lt;/p{amp}gt; {amp}lt;a href="#" class="btn p-2 btn-outline-secondary"{amp}gt;View the gallery{amp}lt;/a{amp}gt; {amp}lt;/div{amp}gt; {amp}lt;/div{amp}gt; {amp}lt;/div{amp}gt; {amp}lt;/div{amp}gt; 

Это для работы. Так что, если кто-то может ответить как можно скорее, я буду очень благодарен!

Понравилась статья? Поделиться с друзьями:
JavaScript & TypeScript
Adblock
detector