So platzieren Sie große Bilder auf kleinem Raum einer Webseite

So platzieren Sie große Bilder auf kleinem Raum einer Webseite

Originalquelle: www.bamagazine.com

Enge Bereiche gibt es überall: Banner auf Webseiten, der Bereich um Nachrichtenüberschriften, Spaltenanzeigen. Ein Foto aus einer Kamera ist jedoch viel größer, mit einem typischen Maß von 6 x 4 Zoll. Wie gehen Sie mit der Beziehung der beiden um? In diesem Artikel stellen wir drei Lösungen vor.

1. Nachrichtentitel:

Wir möchten im Titelbereich ein großes Foto verwenden, was müssen wir tun?

1. Mutiger Schnitt:

Wenn die freie Fläche Ihres Fotos die gleiche Breite hat wie die Fläche auf die Sie es auftragen möchten, können wir einen fetten Schnitt auf dem Foto machen. Es mag für Sie faszinierend sein, dass ein kleines Foto die Essenz eines größeren Fotos vermitteln kann.

Wählen Sie den Brennpunkt Ihres Fotos und wenden Sie den Ausschnitt darauf an. Sie werden überrascht sein, aber je schmaler Sie schneiden, desto eindrucksvoller wirkt das Foto!

Allein beim Betrachten des Bildes oben können unsere Augen schnell eine Vielzahl von Informationen aufnehmen, darunter:

  • ihr Alter;
  • ihr Geschlecht;
  • ihre Haare;
  • ihre Kleidung;
  • Ihre Ausdrücke;
  • ihre Beziehung;

Und all das ist genau das, was wir brauchen!

Das zugeschnittene Bild wurde im Titel dieses Artikels über Altersversorgung verwendet. Der Effekt ist sehr gut, sogar besser als bei Verwendung des großen Originalbilds !

Vorherige Seite 1 2 3 Nächste Seite Mehr lesen

<<:  Tutorial zur Verwendung von Docker Compose zum Erstellen von Confluence

>>:  Grundsätze zur Auswahl von MySQL-Datentypen

Artikel empfehlen

So verstecken Sie RAR-Dateien in Bildern

Sie können dieses Logo lokal als .rar-Datei speic...

Unterschiede zwischen ES6-Vererbung und ES5-Vererbung in js

Inhaltsverzeichnis Nachlass ES5-Prototypvererbung...

So ändern Sie in Nginx die über http aufgerufene Website in https

Inhaltsverzeichnis 1. Hintergrund 2. Voraussetzun...

Tutorial und Praxis zu den virtuellen Speichereinstellungen unter Linux

Was ist virtueller Speicher? Zunächst werde ich e...

So behandeln Sie einen Überlauf numerischer MySQL-Typen

Lassen Sie mich Ihnen nun eine Frage stellen. Was...

RHEL7.5 MySQL 8.0.11 Installations-Tutorial

Dieser Artikel zeichnet das Installationstutorial...

Beispiel für das Herunterladen von Dateien mit vue+django

Inhaltsverzeichnis 1. Übersicht 2. Django-Projekt...

So verwenden Sie Axios, um Netzwerkanforderungen in React Native zu stellen

In der Front-End-Entwicklung gibt es viele Möglic...

MySQL-Einstellungscode für die grüne Version und Details zum Fehler 1067

MySQL-Einstellungscode für grüne Version und Fehl...