Bild je nach Bildschirmauflösung zentrieren und Ränder abschneiden

[Felix_928]

Hallo Forum,
ich hab ein Bild, welches die Abmaße 1920*1080 hat. Nun soll je nach Bildschirmauflösung des Geräts welches die Website darstellt links, rechts, oben und unten gleich viel abgeschnitten werden. Wie stelle ich das am besten an?
Bitte antwortet mir möglichst schnell, die Seite soll möglichst heute Abend noch online gehen... ;)
Danke!

 

[threadi]

Du kannst hier nicht erwarten, dass man dir sofort auf deine Fragen antwortet - Du hast die Eile, niemand anderes.

Deine Fragestellung ist zudem falsch. Webseiten interessieren sich nicht für Bildschirmauflösungen oder Geräte-Einstellungen. Webseiten nehmen immer nur den Viewport im Browserfenster ein. Daher bringt es nichts, wenn Du uns deine Auflösung verrätst - Du kannst ja auch mit einem Browserfenster surfen, welches deutlich kleiner als das ist.

Die Antwort auf deine Frage ist btw. im CSS zu suchen. Daher habe ich dein Topic auch von HTML zu CSS verschoben. Wenn Du das Bild als Hintergrundbild einbindest, brauchst Du es nur noch als solches zentrieren.

body {
 background-image: url(bild.jpg);
 background-position: center center;
 background-repeat: no-repeat;
}

Dadurch würde es bei kleineren Viewports auch immer zentriert dargestellt werden. Alles was über den Viewport hinaus geht, wird nicht dargestellt und führt auch nicht zu unschönen Scrollbalken.

 

[Felix_928]

Danke, genau das hab ich gesucht ;)
und das mit dem Bild war nicht auf die Bildschirmauflösung bezogen, sondern auf das Bild, welches in den Background sollte ;)