Zeigen Sie mehrere Bilder in einem div

Wie zeigen Sie mehrere Bilder in einem Div mit Css und HTML?
Beispiel: https://www.awesomescreenshot.com/image/3066306/6f04718aa19dcc4b88192304a0f9a307.Zeigen Sie mehrere Bilder in einem div

Hier ist, was ich bisher getan haben:

<body> 
 
    <div class="deck"> 
 
    <img src="https://image.tmdb.org/t/p/w220_and_h330_bestv2/kXlrGioGfFKOvibpsPzzGx16cP2.jpg" alt="testimage"> 
 
    <img src="https://image.tmdb.org/t/p/w220_and_h330_bestv2/zzfwhweu5reCv2Loqzon7Q5WAd5.jpg" alt="testimage"> 
 
    <img src="https://image.tmdb.org/t/p/w220_and_h330_bestv2/sGuZHYvu0mXeQCwvJ5yzk2Yoytq.jpg" alt="testimage"> 
 
    <img src="https://image.tmdb.org/t/p/w220_and_h330_bestv2/4Ar01t6sW1ZZBcbz2R1wqjzIBdr.jpg" alt="testimage"> 
 

 
    </div> 
 
</body>

https://jsfiddle.net/wa9gfgvz/

Quelle

2017-12-28 Mappy Lord

versuchen, diese https://jsfiddle.net/wa9gfgvz/2/ –

ok, es ist gut funktioniert, was dein Problem ist, ich sehe nicht irgendwelche –

ich zeigen wollen, die Bilder wie dieses Beispiel: https://www.awesomescreenshot.com/image/3066306/6f04718aa19dcc4b88192304a0f9a307 –

trennen sich die Bilder in zwei verschiedenen divs und bringe diese divs innerhalb eines Haupt div, dann, wenn Wenn Sie möchten, können Sie das ContainerDiv zentrieren oder was auch immer damit machen, und der Inhalt besteht immer aus zwei Bildern pro Zeile.
Aber ich schlage vor Bootstrap auf diese Art von Funktion nutzen zu können, aber auch immer, hier ist es kommen:

<div class='ContainerDiv'> 
     <div class="deck"> 
      <img src="https://image.tmdb.org/t/p/w220_and_h330_bestv2/kXlrGioGfFKOvibpsPzzGx16cP2.jpg" alt="testimage"> 
      <img src="https://image.tmdb.org/t/p/w220_and_h330_bestv2/zzfwhweu5reCv2Loqzon7Q5WAd5.jpg" alt="testimage"> 
     </div> 

     <div class="deck"> 
      <img src="https://image.tmdb.org/t/p/w220_and_h330_bestv2/sGuZHYvu0mXeQCwvJ5yzk2Yoytq.jpg" alt="testimage"> 
      <img src="https://image.tmdb.org/t/p/w220_and_h330_bestv2/4Ar01t6sW1ZZBcbz2R1wqjzIBdr.jpg" alt="testimage"> 
     </div> 
</div>

CSS:

.deck{ 
    display:flex; 
}

Fiddle: https://jsfiddle.net/prtanruz/

Quelle

2017-12-28 12:49:44

Können Sie das versuchen?

.deck{ 
    display:block; 
    width:100%; 
    } 

    .deck img{ 
    width:50%; 
    float:left; 
    }

Siehe: JSFiddle

Quelle

2017-12-28 12:50:15

Zeigen Sie mehrere Bilder in einem div

Antwort

Verwandte Themen