2016-06-04 4 views
0

ich ein JPEG-Bild von einem O X Photo Booth wie diese:Crop und Overlay ein 2x2 Bild auf ein 4x4-Raster ohne Spalte/Zeile wiederholen

GR 
BM

Mit Hilfe von CSS3, würde Ich mag an Mit diesem Bild auf der Außenseite meines HTML5 article Element, wie folgt aus:

 GR 
BaaM 
GaaR 
BM

Oder wie folgt aus:

 GR 
GaaR 
BaaM 
BM

Oder auch dies:

 RG 
BaaM 
GaaR 
MB

Oder, wie Sie auf allen Seiten sehen, passen, aber ohne Zeilen oder Spalten, wo das gleiche Teil des Bildes wiederholt wird (auch, wie oben, muss jeder Teil die gleiche Anzahl gezeigt hat mal insgesamt), zB nicht wie folgt aus:

GRGR 
BaaM 
GaaR 
BMBM

Was ist der beste Weg, so etwas wie dies mit CSS3 zu tun?

+0

Suchen Sie etwas wie 'background-size: 4px 4px', um es künstlich zu vergrößern oder' image-rendering: crisp-edges', um sicherzustellen, dass es nicht interpoliert wird? – MattDiMu

+0

@MattDiMu, nein, es ist eines dieser "Grün/Rot/Blau/Monochrom" Filter Fotos (wo Ihr Foto 4 mal im Originalbild erscheint); Ich möchte die einzelnen Teile auf verschiedenen Seiten meines Hauptinhalts zeigen. – cnst

Antwort

0

Kann es helfen?

.content { 
 
    background-color: white; 
 
} 
 

 
.wrapper { 
 
    padding: 30px; 
 
    background-position: center center; 
 
    background-size: cover; 
 
    background-image: url(data:image/png;base64,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) 
 
}
<div class="wrapper"> 
 
    <div class="content"> 
 
    Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. 
 
    </div> 
 
</div>

+0

Nein, dies ist die naive Lösung, die speziell als nicht akzeptabel aufgelistet ist - ein 2x2-Bild wird zweimal in allen äußeren Spalten und Reihen einer 4x4-Matrix wiederholt. – cnst

+0

Entschuldigung für diese naive Lösung, ich kann Ihre Beschreibung des Problems nicht vollständig verstehen. Wenn Sie ein Bild anstatt GRBM für die Demo veröffentlichen können, wäre es besser. –

+0

Überprüfen Sie die andere Lösung auf eine Probe von dem, was erforderlich war; Wenn es vorher nicht für dich funktionierte, versuche es noch einmal - das externe Bild von vals war unten, als du deinen Kommentar oben gepostet hast, es scheint jetzt wieder da zu sein. – cnst

1

ich eine Basis div bin mit Ihrem Bild anzuzeigen. Dieses Div muss dasselbe Verhältnis haben wie dein Div.

Dann lege ich 4 Kopien des Bildes, skaliert 50%, an verschiedenen Stellen des div.

Dies gibt Ihr erwartetes Ergebnis um die Grenzen, aber die Bilder colapse im inneren Teil des Div (siehe Ausschnitt). Jetzt

, legen gerade einen aditional Hintergrund in der Mitte des div es zu bedecken, und Sie sind fertig (Schweben auf dem Snippet das Ergebnis zu sehen)

div { 
 
    width: 400px; 
 
    height: 300px; 
 
    background-image: url(http://lorempixel.com/400/300), url(http://lorempixel.com/400/300), url(http://lorempixel.com/400/300), url(http://lorempixel.com/400/300); 
 
    background-size: 50% 50%; 
 
    background-repeat: no-repeat; 
 
    background-position: 0% 50%, 100% 50%, 50% 0%, 50% 100%; 
 
} 
 

 
div:hover { 
 
    background-image: linear-gradient(white, white), url(http://lorempixel.com/400/300), url(http://lorempixel.com/400/300), url(http://lorempixel.com/400/300), url(http://lorempixel.com/400/300); 
 
    background-position: 50% 50%, 0% 50%, 100% 50%, 50% 0%, 50% 100%; 
 
    
 
}
<div></div>

Eine weitere Idee mit mehr Markup, aber ein einzelnes Hintergrundbild

.main { 
 
    width: 400px; 
 
    height: 300px; 
 
    background-image: url(http://lorempixel.com/400/300); 
 
    background-size: 50% 50%; 
 
    background-repeat: repeat; 
 
    background-position: 50% 0%; 
 
    position: relative; 
 
} 
 

 

 

 
.main:before, .main:after { 
 
    content: ""; 
 
    position: absolute; 
 
    width: 100%; 
 
    height: 25%; 
 
    left: 0px; 
 
    background-image: linear-gradient(to right, white 25%, transparent 25%, transparent 75%, white 75%); 
 
} 
 
.main:before { 
 
    top: 0px; 
 
} 
 

 
.main:after { 
 
    bottom: 0px; 
 
} 
 

 
.inner { 
 
    position: absolute; 
 
    width: 50%; 
 
    height: 50%; 
 
    left: 25%; 
 
    top: 25%; 
 
    background-color: white; 
 
}
<div class="main"><div class="inner"></div></div>

+0

+1, das scheint nach der Spezifikation zu sein! Weißt du, ob dies überall unterstützt wird oder ob irgendwo Probleme auftreten? Außerdem bevorzuge ich, dass es entweder vollständig unterstützt wird oder überhaupt nicht unterstützt wird - gibt es eine Möglichkeit, dass all diese Dinge in eine einzige "Hintergrundeigenschaft" passen? – cnst

+0

Unterstützung ist gut, nur IE8 fehlt http://caniuse.com/#feat=multibackgrounds – vals

+0

Ich habe keine Zeit jetzt, werde ich eine andere Antwort mit einem einzigen Hintergrund auf der Div morgen – vals