2017-05-12 5 views
-3

Ich habe zwei Bilder:Zwei Bilder immer in der gleichen Position

enter image description here

und

enter image description here

Ich möchte, dass sie auf einer Webseite wie folgt dargestellt werden:

enter image description here

Eine Mitte des grünen Rechtecks ​​sollte immer die Mitte des orangefarbenen Punkts abdecken, unabhängig davon, welche Auflösung ein Bildschirm hat und unabhängig davon, wie groß die Bilder sind (die Größe ändert sich, wenn das Browserfenster seine Größe ändert). Wenn sich die Größe des Browserfensters ändert, sollten beide Bilder auf die gleiche Weise skaliert werden (wenn beispielsweise Bild A 30% kleiner ist als vor der Größenanpassung, sollte Bild B auch 30% kleiner sein als vor der Größenanpassung).

Wie kann ich ein Ergebnis wie dieses erhalten?

+0

[Absolute Positionierung] (https: // Entwickler. mozilla.org/en-US/docs/Web/CSS/position) – Blazemonger

+0

Wenn es immer so sein wird, warum nicht einfach vereinfachen und den grünen Teil des grauen Bildes machen? Scheint so, als ob Sie versuchen, Dinge ohne Grund zu komplizieren – Pete

+0

Es ist nur ein Beispiel natürlich. Meine Situation ist ein bisschen komplizierter, da ich ein paar Bilder habe und während der Laufzeit wird entschieden, welches angezeigt werden soll - manchmal wird es ein grünes Rechteck, manchmal ein blaues, und so weiter. – Loreno

Antwort

Verwandte Themen