nicht angemeldet
Bild einpassen
Hallo,
gibt es mit CSS/HTML eine Möglichkeit ein Bild der Größe 3900x2600 Pixel so in die Homepage einpassen, dass es
- nicht verzogen ist (nur skalieren)
- die komplette Webseitenhöhe nach unten durchgehend ist
- das Bild horizontal zentriert ist und es rechts und links notfalls etwas abschneidet.
Wie kann man das machen?
Thomas
-
Wie kann man das machen?
Erstelle einen DIV der die optimale Größe des Bildes haben soll, dann gibst du dem DIV ein
overflow:hiddenund zentrierst ihn mittig im BODY.Jetzt kannst du dein Bild da reinnkallen, entweder mit dem IMG-TAG oder mit
background-image bzw. background.Jetzt wird dein Bild beschnitten, wenn er größer ist als das DIV, aber er wird nicht skaliert, das musst du dann über die IMAGE-Größe regeln, entweder in HTML (IMG-Attribute: width, height) oder via CSS.
Wenns dynamisch sein soll, dann kommst du im JS/PHP/PERL usw. nicht herum.
-
Moin
Erstelle einen DIV der die optimale Größe des Bildes haben soll, dann gibst du dem DIV ein
overflow:hiddenund zentrierst ihn mittig im BODY.Jetzt kannst du dein Bild da reinnkallen, entweder mit dem IMG-TAG oder mit
background-image bzw. background.Quatsch mit Soße:
dem Body ein Hintergrund geben und mittig setzen mit der Eigenschaft "center"
z.B.
<body style="background:url(irgendeinbild.jpg) top center">Das genügt. Da ist kein DIV notwendig
Die Größe de background kann sowiesio nicht mit CSS geregelt werden.
Gruß Bobby
--
-> Für jedes Problem gibt es eine Lösung, die einfach, sauber und falsch ist! <-
### Henry L. Mencken ###
-> Nicht das Problem macht die Schwierigkeiten, sondern unsere Sichtweise! <-
## Viktor Frankl ###
ie:{ br:> fl:{ va:} ls:< fo:) rl:( n4:( de:> ss:) ch:? js:( mo:} sh:) zu:)-
Quatsch mit Soße:
<body style="background:url(irgendeinbild.jpg) top center">Die Größe de background kann sowiesio nicht mit CSS geregelt werden.
Also nicht nur aggressiv, auch noch am Thema vorbei:
- die komplette Webseitenhöhe nach unten durchgehend ist
Kalle
-
Moin
Also nicht nur aggressiv, auch noch am Thema vorbei:
Bin doch ne aggressiv
- die komplette Webseitenhöhe nach unten durchgehend ist
Das hatte ich anders verstanden. Ich habe das so verstanden, das ein Bild mitwächst mit dem Seiteninhalt. D.h wenn die Seite größer als der Viewport wird soll das Bild ebenfalls vergrößert werden. Und das ist Unsinn.
Meine Antwort bezog sich auf die horizontale Zentrierung. Nach der in Punkt 3 ja ebenfalls gefragt wurde.
Gruß Bobby
--
-> Für jedes Problem gibt es eine Lösung, die einfach, sauber und falsch ist! <-
### Henry L. Mencken ###
-> Nicht das Problem macht die Schwierigkeiten, sondern unsere Sichtweise! <-
## Viktor Frankl ###
ie:{ br:> fl:{ va:} ls:< fo:) rl:( n4:( de:> ss:) ch:? js:( mo:} sh:) zu:)
-
Quatsch mit Soße:
Guten Appetit ;)
dem Body ein Hintergrund geben und mittig setzen mit der Eigenschaft "center"
z.B.
<body style="background:url(irgendeinbild.jpg) top center">
Das genügt. Da ist kein DIV notwendigDa magst du Recht haben, aber ich bin davon ausgegangen das der TS das Bild seinen Usern zum Download bereit stellen wollte, das ist für mich der einzige Grund so große Grafiken im Internet zu presäntieren.
Bei deiner Lösung könnten unerfahrene User die Grafik nicht downloaden.
OK, habe sowas ähnliches vorgeschlagen, aber immerhin mit einer alternative...Die Größe de background kann sowiesio nicht mit CSS geregelt werden.
Habe ich auch nicht behauptet.
-
-
Wenns dynamisch sein soll, dann kommst du im JS/PHP/PERL usw. nicht herum.
JavaScript reicht aus - wenn man das Bild noch in verschiedenen größen (und qualitätsstufen vorhalten möchte) ist eine serverseitige Sprache sinnvoll :)
Wie sowas aussehen könnte ist hier zu sehen:
http://buildinternet.com/2009/02/supersized-full-screen-backgroundslideshow-jquery-plugin/
-
-
Moin
gibt es mit CSS/HTML eine Möglichkeit ein Bild der Größe 3900x2600 Pixel so in die Homepage einpassen, dass es
- nicht verzogen ist (nur skalieren)
nein
- die komplette Webseitenhöhe nach unten durchgehend ist
nein
- das Bild horizontal zentriert ist und es rechts und links notfalls etwas abschneidet.
ja
Warum willst du ein so großes Bild in die Webseite einpflanzen? Das ist nicht gerade userfreundlich.
Gruß Bobby
--
-> Für jedes Problem gibt es eine Lösung, die einfach, sauber und falsch ist! <-
### Henry L. Mencken ###
-> Nicht das Problem macht die Schwierigkeiten, sondern unsere Sichtweise! <-
## Viktor Frankl ###
ie:{ br:> fl:{ va:} ls:< fo:) rl:( n4:( de:> ss:) ch:? js:( mo:} sh:) zu:)-
Warum willst du ein so großes Bild in die Webseite einpflanzen? Das ist nicht gerade userfreundlich.
Zu dekorationszwecken - sieht doch gut aus auf eine Landingpage - besonders bei Hotels oder mache ich das sehr gerne so und sieht gut aus.
-
Hallo,
gibt es mit CSS/HTML eine Möglichkeit ein Bild der Größe 3900x2600 Pixel so in die Homepage einpassen, dass es
- nicht verzogen ist (nur skalieren)
dafür gibst du nur entweder width oder height an
- die komplette Webseitenhöhe nach unten durchgehend ist
height:100%
- das Bild horizontal zentriert ist und es rechts und links notfalls etwas abschneidet.
position:absolute; left:50%; margin-left:-1950px
Bildecke links oben in die Mitte (50%) und dann die Hälfte der Breite nch links.
LG Kalle