Wie man ein Bild so auf zwei Seiten ausblenden lässt [geschlossen]

Wie können Sie ein Bild erstellen, das in den Hintergrund übergeht, sodass es in verschiedenen Breiten verwendet werden kann (Ausblenden + dieselbe Hintergrundfarbe). Somit kann es bei jeder Bildschirmauflösung verwendet werden.

Frau vor einem verschwommenen Bürohintergrund

Bitte klären Sie, was die Verwendung ist? Ist es für eine Website, wo es auf die Browserbreite skaliert werden würde? Bilder sind statisch, sie können sich nicht selbst verändern.
Ja, es wird für eine Website verwendet. Bild kann nicht skaliert werden, aber der Hintergrund kann sein. die Hintergrundfarbe genau wie die Seitenfarbe des Bildes.
Für den Wechsel zu Grafikdesign vorgemerkt
Dies wurde quer zum Grafikdesign gepostet.

Antworten (2)

Hier ist die allgemeine Technik. Sie können die Größe eines einzelnen Bildes nicht ändern, aber Sie können mehrere Bilder haben. Das Haupthintergrundbild wird so eingestellt, dass es auf das Div zugeschnitten wird, in dem es sich befindet. Dann haben Sie auf jeder Seite ein Bild, das Sie ausblenden möchten. Jedes davon ist ein Farbverlauf vom Hintergrund zu transparent. Zur Verdeutlichung habe ich ein Beispiel angehängt. Wenn die Größe des Div geändert wird, werden die Schnittbilder verschoben, um den Effekt zu erzeugen.

Geben Sie hier die Bildbeschreibung ein

Ich möchte auch hinzufügen, dass die Umkehrung dieser Methode möglich ist. Sie können die Ränder des Bildes verblassen lassen und den Hintergrund in einer beliebigen Farbe haben. Auf diese Weise wird bei einem sehr schmalen Browserfenster (mobile Geräte) das Gesicht im Beispielbild niemals von der Seitenblende verdeckt. Wenn Sie die CSS3-Farbverlaufsfarbe mit dem RGBA-Farbcode verwenden, können Sie die von Phil beschriebene Methode verwenden, ohne das PNG-Format für Transparenz zu verwenden. Es benötigt zwar Browserunterstützung, aber mit HTML5 wird dies von den meisten unterstützt. Ich schlage jedoch vor, auf den anderen Stackexchange-Sites wie Webmaster oder Grafiken nachzuschauen, um mehr darüber zu erfahren.

Das Foto, das Sie als Beispiel präsentieren, hat eine geringe Schärfentiefe, die durch die große Blende gegeben ist, mit der es aufgenommen wurde. Es kann auch durch eine mäßig große Blende gegeben sein, die in Kombination mit einem Objektiv mit langer Brennweite verwendet wird.

Dies ist eine Fotografie-Website, daher finden Sie oben die Details zum fotografischen Teil des Bildes. Sie können auch einen ähnlichen, aber nicht exakten (Meinungs-) Effekt erzielen, indem Sie das Bild mithilfe einer Software in bestimmten Bereichen weichzeichnen. Häufig wird dafür Adobe Photoshop verwendet.

Die Tatsache, dass Sie das Tag „Feuerwerk“ in dem Beitrag verwendet haben, lässt mich glauben, dass Sie nach Webdesign fragen, und wenn dies der Fall ist, wäre diese Frage für diesen Bereich auf dieser Fotografie-Website wahrscheinlich nicht zum Thema, Sie können es versuchen den Grafikdesign-Stack-Austausch hier: https://graphicdesign.stackexchange.com/

danke, die Seite kenne ich nicht. Ich werde dort fragen.