Automatische Skalierung von IMG
Hallo,
das automatische Skalieren von Bildern funktioniert leider nicht ganz so, wie es sollte. Ich verwende diesen CSS-Code dafür: .IMGskalierbar { width: 100%; height: auto; width: auto\9; /* ie8 */ } und die meisten Bilder, die es betrifft, stecken in Tabellen. Pro <TD> maximal 1 Bild, Höhe fest 150 Pixel, Breite aber variabel. Wenn ich das Browserfenster verkleinere, schrumpfen auch die Bilder: soweit OK. ABER: alle Bilder werden auf die Breite der Tabellenspalte aufgezogen, die der Browser anhand irgendwelcher Kriterien festlegt (wahrscheinlich nach dem breitesten vorhandenen Bild). Bilder, die schmal sind, werden dann unnatürlich groß (und auch viel höher als die ursprünglichen 150 Pixel). Sehr schön zu sehen ist das z.B. hier: JASMS Anime-Synchronsprecher: Nonaka Ai bei dem Eintrag "Kaleido Star" (Folge 21): Melissa Das Bild von Melissa ist im Original gerade mal 120*150 Pixel groß. Natürlich lohnt sich bei so einem kleinen Bildchen keine Skalierung, aber bei zig tausenden von Bildern brauche ich eine Lösung, die universell funktioniert, ohne dass man von Hand Ausnahmen konfigurieren muss. Zudem werden Bilder, die nicht in Tabellen stecken, mit diesem Verfahren auf die volle Seitenbreite vergrößert, was sie ebenfalls absurd groß macht. Ich habe im CSS-Code mal width durch max-width ersetzt, aber dann skaliert gar nichts mehr. Was ich sonst noch so alles mit width und height ausprobiert habe, weiß ich inzwischen gar nicht mehr. Genutzt hat alles nicht. Ich hoffe, hier im Forum hat jemand eine Idee, wie man Bilder dazu bringt, sich verkleinern zu können, ohne aber größer als ihre Originalgröße zu werden. Vielen Dank schon mal! |
Zitat:
Beispiel: A Pen by Captain Anonymous Ob es eine Tabelle sein sol musst du selber entscheiden. Eine Tabelle ist für tabellarische Daten gedacht. HTML-Code:
<!DOCTYPE html> MfG Roland |
Vielen Dank
Hallo Roland,
faszinierend! Und vielen Dank für diese ausführliche Antwort. Bei meiner Lösung mit dem width: 100%; height: auto; ist es, wenn ich das richtig verstanden habe, so, dass das Bild sich immer auf die Größe des nächsten übergeordneten Elements ausdehnt, sei ein ein TD oder die ganze Seite. Die Lösung, die ich mir überlegt habe, besteht darin, jedes IMG in ein entsprechend skaliertes DIV zu stecken. Nachteil: man muß jedes Bild einzeln anfassen. Aber leider ist das bei deiner Lösung auch so, nur steckt diese Information an einer anderen Stelle. Eine generelle Anweisung an den Renderer "kleiner skalieren ja, größer aber nicht" gibt es offenbar nicht. Schade. Trotzdem Danke. Man lernt immer etwas dazu. Viele Grüße, JASMS |
Zitat:
|
Zitat:
Und das ist bei weitem nicht die einzige Altlast. Aber zweieinhalbtausend Seiten ändert man nicht mal so auf die Schnelle. Viele Grüße, JASMS |
Doch, laut definition wars damals nicht mehr oder weniger verboten als heute. Es hat sich nur niemand daran gehalten, bzw. waren die technischen Möglichkeiten nicht so weit ;)
Hat man ein Template für zweieinhalbtausend Seiten dann kann man auch diese innerhalb kürzester Zeit ändern. Außer man war auch hier faul und hat alle per Hand angelegt :D Aber gut, eine Seite, die seit dem letzten Jahrtausend nicht mehr aktualisert werden musste, kann nicht soo wichtig sein, dann kannst du auch ruhig bei den Tabellen bleiben. |
Alle Zeitangaben in WEZ +2. Es ist jetzt 15:48 Uhr. |
Powered by vBulletin® Version 3.8.11 (Deutsch)
Copyright ©2000 - 2024, vBulletin Solutions, Inc.
© Dirk H. 2003 - 2023