Aus dem Kurs: Responsive Webdesign – Grundlagen

Erhalten Sie Zugriff auf diesen Kurs – mit einer kostenlosen Probeversion

Werden Sie noch heute Mitglied und erhalten Sie Zugriff auf mehr als 25.300 Kurse von Branchenfachleuten.

Flüssige Bilder

Flüssige Bilder

Auf Webseiten gibt es klassischerweise Elemente, die feste Ausmaße haben, dazu zählen Bilder. Mit einem kleinen Trick sorgen Sie dafür, dass diese das flüssige Layout nicht stören. Hier sehen Sie ein Bild was eingebunden ist und derzeit gibt es ein Problem, wenn ich den Viewport verkleinere, dann sehen Sie, dass das Bild herausragt. Wir haben eine Scroll-Leiste und das Bild ragt aus diesem Bereich heraus, könnte anderen Fällen natürlich auch irgendeinen Text verdecken. Also wir haben ein Problem wir müssen uns darum kümmern. Für solche Bilder für Experimente nämlich gern einen Dienst namens "Placeholder.com". Das Praktische daran ist, dass Sie die Ausmaße des Bildes direkt angeben können und so kann man auch schnell testen, was passiert denn, wenn das Bild andere Ausmaße hätte. Das ist mein Bild was ich eingefügt habe mit den Ausmaßen 300 x 150 Pixel und das Problem sind die 300 Pixel in der Breite, weil das ist schnell zu viel. Durch einen kleinen Trick kann ich dieses Problem lösen…

Inhalt