Bild responsive machen
Peter
- css
0 Matthias Apsel0 Peter0 klawischnigg0 Peter0 klawischnigg0 Peter
Hallo,
zur Realisierung der Skalierbarkeit eines Bildes habe ich gefunden: max-width: 100%; height: auto;
Nun habe ich ein Bild (width: 180px), das ich an anderer Stelle auch so benötige. An anderer Stelle benötige ich aber das Bild in einer Maximalgröße von 120px. Ich dachte dann, ich gebe zusätzlich an width: 120px; was aber nicht funktioniert. Muss ich also ein zweites kleineres Bild erstellen?
Hallo Peter,
Muss ich also ein zweites kleineres Bild erstellen?
Nein.
Kannst du die Seite zeigen?
Die Idee ist, für dieses Bild andere CSS-Vorgaben zu machen, z.B. max-width:120px;
Bis demnächst
Matthias
Hallo
<html>
<head>
<style>
img {
max-width: 480px; <!-- Originalgröße 960px -->
height: auto;
}
</style>
</head>
<body>
<img src="stop.GIF" alt="Logo" />
</body>
</html>
Bei Verkleinerung des Fensters bleibt das Bild gleich groß
Hi there,
Bei Verkleinerung des Fensters bleibt das Bild gleich groß
Ist ja klar. Für "Responsivität" darfst Du keine Absolut-Angabe wie px oder ähnliches verwenden. Hinzuzufügen wäre, das eine Angabe wie img {...} natürlich ALLE Bilder in einer Seite betrifft…
Lies mal den Beitrag von Matthias!
Hi there,
Lies mal den Beitrag von Matthias!
Wozu? Um zu sehen, daß Du ihn nicht verstanden hast?
Er hat eine ganz klare Ansage gemacht! Und wenn da max-width steht, heißt das für mich, es darf auch kleiner werden, egal ob %, px oder km