2016-08-09 1 views
0

Wie kann ich Raum die Bilder automatisch auf die Größe des Bildschirms‘ htmlWie Raum ich automatisch die mehrere Bilder über die Breite des Bildschirms ‚html

+2

Sie benötigen ein Minimum Beispiel bieten für uns –

+0

Ihr Problem zu diagnostizieren Bitte geben Sie ein Beispiel von dem, was Sie wollen. Wünschen Sie ein einzelnes Bild die volle Breite oder mehrere Bilder in Spalten? –

+0

Ich habe 3 Bilder in einer Reihe Ich möchte gleich Platz auf beiden Seiten des mittleren Bilds haben, so dass der erste img beginnt links dann Raummitte img dann Raum dann rechts img aber die "Raum" gleich beide Seiten der Mitte img –

Antwort

0

Ja bitte posten Sie Ihre HTML und CSS gleichermaßen passen.

Ansonsten, was ist wirklich nützlich, wenn Ihr macht eine Galerie ist Ihre Bilder gleicher Höhe und Breite zuschneiden und dann

img{ 
width:100%; 
} 

ich die Höheneinstellung vermeiden würde hinzufügen, wenn Sie alle Ihre Bilder gleicher Höhe machen als es kann reaktionsfreudig wirken. Die Höhe sollte automatisch durch die Größe des enthaltenen Elements festgelegt werden, wenn die Breite auf 100% eingestellt ist.

+0

Nicht so wie lege ich Bilder an? –

+0

Ich habe 3 Bilder in einer Reihe Ich möchte den gleichen Platz auf beiden Seiten des mittleren Bilds haben, so dass der erste img beginnt auf der linken Seite, dann im mittleren Raum img dann Raum dann rechts img aber die "Raum" gleich beide Seiten der Mitte img –

+0

Sie müssen Ihr CSS und HTML posten, da wir nicht wissen, was Sie bisher tun. –

0

Das ist ein Beispiel, um Bilder gleichmäßig zu erhalten & horizontal in einer Div via CSS;

CSS

#thumbs { 
    width: 540px; 
    margin-top:90px; 
    margin-left: auto; 
    margin-right: auto; 

    text-align: justify; 
    -ms-text-justify: distribute-all-lines; 
    text-justify: distribute-all-lines; 
} 
#thumbs a { 
    vertical-align: top; 
    display: inline-block; 
    *display: inline; 
    zoom: 1; 
} 
.stretch { 
    width: 100%; 
    display: inline-block; 
    font-size: 0; 
    line-height: 0 
} 

HTML

<div id="thumbs"> 
    <a id="single_image1" href="#"><img src="http://dummyimage.com/150x150/444/fff" alt=""/></a> 
    <a id="single_image2" href="#"><img src="http://dummyimage.com/150x150/444/fff" alt=""/></a> 
    <a id="single_image3" href="#"><img src="http://dummyimage.com/150x150/444/fff" alt=""/></a> 
    <span class="stretch"></span> 
</div>​ 
+0

http://kjs-coding-solutions.netau.net schauen Sie, Sie werden wissen, was ich meine –

Verwandte Themen