Bildgrösse anpassen

derneue2017

Ich habe ein Div Container mit 200 x 200 px.

Mein bild ist 5 mal so gross und soll aber komplett angezeigt werden,nur halt kleiner.

Was muss ich in der Css ändern damit ich nicht nur ein Teil Bild sehe?

basti1012

ich würde es mal mit background-size versuchen.

ich hatte mal so was in der art und habe dann

Code

background-size:cover;

hingeschrieben,und es hat zumindest in mein fall funktioniert.

Aber vieleicht sieht es bei dir ja anders aus .

Zeig doch mal deine css ,dann kann man bestimmt besser helfen

JR Cologne

Die Frage ist vor allen Dingen, wie das Bild eingebunden wurde.

derneue2017

Ja danke Basti1012 , das background-size klappt.

Aber seht mal bei den anderen nicht .

Siehe FIDDLE steht alles drinne was ich meine.

https://fiddle.jshell.net/8bn207gh/

basti1012

habe dir mal beispiel gemacht ,die die ich kenne unddie hier im beispiel auch zulaufen scheinen. fals einer noch nee idee hat kann er ja dasscript verlängern oder einfach hier hin posten

https://jsfiddle.net/basti1012/o29mf4xb/

JR Cologne

Gebe dem img einfach ein width: 100% und height: auto.

derneue2017

Zitat von JR Cologne

Gebe dem img einfach ein width: 100% und height: auto.

Wieso height:auto;?

Währe da 100% nicht sinnvoller?

olkostbe

Eher nicht, da die Höhe sich mit 'auto' im Verhältnis zur Breite anpasst (Umgekehrt geht natürlich auch, je nachdem was sinnvoller ist). Somit keine Verzerrung.

Wenn du aber das ganze in Breite und Höhe mit 100% angibst können die Bilder verzerrt dargestellt werden.

JR Cologne

Korrekt!

derneue2017

Ich habe erst das beispiel von Basti genommen

Code

#ta2 img{
  width:100%;
  height:100%;

}

was funktioniert,da wird das Bild 100% tig in den div ausgefüllt.

Was bei den Code wahrscheinlich auch so sein soll .

Dann habe ich es mit auto gemacht,

Code

#ta2 img{
  width:100%;
  height:auto;

}

da wird das Bild 16 zu 9 angezeigt.

Also ich meine wie so ein Kinobild Format.

Soll das so sein ,oder macht der das nur bei bestimmten Fotos?

basti1012

j

Zitat von derneue2017

Dann habe ich es mit auto gemacht,

da wird das Bild 16 zu 9 angezeigt.

kommt auf die bild masse an . wenn du ein bild hast mit 800 x 800 pixel dann wird bei auto auch das ganze div ausgefüllt. ist dein bild aber nur 800 mal 600 pixel gross,dann wird es 16/9 angezeigt... also immer passen zur breite,so wie oben von olkostbe beschrieben das es dann nicht verzert wird.

also im zweifelsfall immer ein wert auf auto stellen dann hast du saubere bilder. willst du aber ohne rücksicht auf verluste das ganze diy ausfüllen dann mach beides 100 % ( oder "COVER" geht glaube ich auch )

Jetzt mitmachen!