[CSS] Hintergrund strecken

Dieses Thema im Forum "Webdesign" wurde erstellt von »The Gr4ndp4, 15. Oktober 2010 .

Schlagworte:
  1. 15. Oktober 2010
    Hintergrund strecken

    Hallo,


    ich wollte das sich mein Hintergrund der zb. 1280x1000 ist, sich allen Benutzern der Seite anpasst, als wenn jemand mit einer Auflösung von 800x600 kommt, das sich das anpasst, ich wollte das so realisieren in css

    PHP:
    body  {
    background url ( images / bg . jpg no - repeat ;
    background - size 100 %;
    }

    Ich arbeite mit Dreamweaver, das Ding ist jetz, in der Dreamweaver vorschau wird mir der Hintergrund angezeigt, doch wenn ich die html datei im Browser öffne, ist alles weis, an was liegt das ?
     
  2. 15. Oktober 2010
    AW: ERLEDIGT Hintergrund strecken

    repeat-x bzw repeat-y entspricht aber nicht dem was er wollte ... nämlich dass sich das bild anpasst auf die volle breite .... ;-)

    mit css3 kann mans bewerkstelligen......css2 noch nicht ......

    css3:

    HTML:
    -moz-background-size: 100%;
    -webkit-background-size: 100%;
    -khtml-background-size: 100%;
     
  3. 16. Oktober 2010
    AW: ERLEDIGT Hintergrund strecken

    Ich hatte das mit den Strecken wirklich nicht so hin bekommen wie ich wollte, habe das dann halt anders gelöst. Aber das sich das Bild streckt habe ich nicht hinbekommen.
     
  4. 16. Oktober 2010
    AW: ERLEDIGT Hintergrund strecken

    okay ... wie gesagt mit css3 gehts .... code hab ich ja gepostet
     
  5. 19. Oktober 2010
    AW: ERLEDIGT Hintergrund strecken

    Ok, also mal ne ganz doofe Frage

    wenn ich jetz ne normale CSS datei erstelle, mit dreanmweaver, ist das dann ne CSS3 datei, oder wie muss ich erkenntlich machen das ich mit CSS3 arbeite ?

    Mein Body Teil sieht dann so aus, aber es geht nicht.
    PHP:
    body  {
    background url ( images / bg . jpg no - repeat ;
    -
    moz - background - size 100 %;
    -
    webkit - background - size 100 %;
    -
    khtml - background - size :   100 %;
    }
    danke
     
  6. 19. Oktober 2010
    AW: ERLEDIGT Hintergrund strecken

    Der CSS Type unterscheidet sich über die Befehle du musst da gar nichts machen. CSS3 wird auch noch nicht von allen Browsern unterstüzt. Firefox ist deine Testumgebung?
     
  7. 19. Oktober 2010
    AW: Hintergrund strecken

    HTML:
    <style type="text/css">
    body {
    background: url(images/test.jpg) no-repeat;
    -moz-background-size: 100%;
    -webkit-background-size: 100%;
    -khtml-background-size: 100%;
    } 
    </style>
    Das funktioniert bei mir und Firefox 3.6.10, IE8 zickt aber schon herrum.
     
  8. 19. Oktober 2010
    AW: Hintergrund strecken

    bei mir klappt es nicht, ich hab nen Bild mit einer auflösung von 1600x1200 und ne auflösung von 1024x768, und dann werden mir auch nur die 1024x768 vom Bild angezeigt.

    hier mein html code

    HTML:
    
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
     <title>Snowboard</title>
     <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
     <link href="style.css" rel="stylesheet" type="text/css" />
    </head>
    
    <body>
    <div class="large">
     Box unten</div> 
     
     <div class="boxl">
     Box links</div> 
     
     <div class="boxr">
     Box rechts</div> 
    
    
    </body>
    </html>
    
    
     
  9. 19. Oktober 2010
    AW: Hintergrund strecken

    Warte mal:
    Bild: 1600x1200
    und Auflösung:1024x768


    Wenn das der Fall ist, musst du das Bild doch gar nicht Strecken weil Bild > Auflösung
    Also wenn das Bild größer als die Auflösung ist, bringen die 100% auch nichts. Also das Bild wird dann nicht auf die Auflösung verkleinert.
     
  10. 19. Oktober 2010
    AW: Hintergrund strecken

    Achso, ich dachte, das verkleinert sich dann auch.
    Naja ok habe es jetz auf dem 22" ausprobiert, da streckt sich es aber auch nicht, da habe ich rechts nen weisen rand
     
  11. 19. Oktober 2010
    AW: Hintergrund strecken

    poste doch dein css code auch mal .... oben steht ja nur der html code ...
     
  12. 19. Oktober 2010
    AW: Hintergrund strecken

    Übernimm das mal bitte zum Test und sag wie es klappt. Spiel mal mit den 100% rum und sag ob das Bild sich verkleiert/vergrößert.

    Code:
    <style type="text/css">
    body {
    background: url(http://www.85qm.de/up/Blume.jpg) no-repeat;
    -moz-background-size: 100%;
    } 
    </style>
     
  13. 19. Oktober 2010
    AW: Hintergrund strecken

    ich kann die Prozente ändern wie ich will, das Bild bleibt gleich groß
     
  14. 19. Oktober 2010
    AW: Hintergrund strecken

    Sag mal bitte deine Firefox-Version.


    Hilfe -> Über Mozilla Firefox.
     
  15. 19. Oktober 2010
    AW: Hintergrund strecken

    daran wirds wohl liegen ... update mal auf n neusten ...

    bei mir geht der code ohne probleme ... ;-)
     
  16. 19. Oktober 2010
    AW: Hintergrund strecken

    Da haben wir das Problem ^^


    3.6

    Die 3.5 Version kann das noch nicht verarbeiten.
     
  17. 19. Oktober 2010
    AW: Hintergrund strecken

    es lag wirklich daran

    wie lang wird es denn ca dauern, bis alle browser damit kompatible sind ?
     
  18. 19. Oktober 2010
    AW: Hintergrund strecken

    wird wohl noch ne weile dauern bis css3 standard ist ....

    hier kannst dich über den aktuellen stand informieren und was mit css3 so möglich ist und sein wird:

    CSS3 . Info - All you ever needed to know about CSS3
     
  19. 19. Oktober 2010
    AW: Hintergrund strecken

    Das Problem werden nicht die Browser unbedingt sein das wird jetzt alles nach und nach kommen mit HTML5 und CSS3. Eher die User die veraltete Versionen benutzen sind das Problem.

    Das heißt im Endeffekt man baut Browserweichen ein oder sagt sich die User die nicht Aktuell sind, haben pech.


    Ich zum Beispiel baue in meinen Seiten keine Browserweichen für Javascript ein.
    Wer kein JS aktiviert hat, kann die Seite halt nicht im vollen Umfang benutzen.
     
  20. 19. Oktober 2010
    AW: Hintergrund strecken

    ganz ehrlich ... wer sein browser nicht aktuell hält is selber schuld und sollte gleich raus bleiben ausm inet ... meine meinung ... man muss halt mit der zeit gehen ....
     
  21. Video Script

    Videos zum Themenbereich

    * gefundene Videos auf YouTube, anhand der Überschrift.