[HTML/CSS]Mitskalierende Hintergrundgrafik

  • Hallo, ich versuche mich jetzt schon länger daran, eine vernünftige Hintergrundgrafik einzubinden, dennoch funktioniert die Skalierung noch nicht so richtig.


    Wenn ihr euch den Quellcode meiner Seite http://www.misterknister.bplaced.net mal anschaut, seht ihr dass ich schon ein bisschen rumgesucht habe, jedoch ohne Resultat.


    Zumindest bei Google Chrome weiß ich, dass man das Fenster verkleinern- und größern kann. Man klicke dazu auf diesen Buttun () und dann auf "-" und "+" unter dem Punkt "Zoomen". Auf meiner Seite funktioniert es nicht, hier jedoch schon: http://www.redmix-roleplay.de. Bitte sagt mir, wie ich das auch erreichen kann.

    Einmal editiert, zuletzt von SunRiZez ()

  • Schreib das mal so:


    Code
    body { 
    	background: url(bg_img.jpg);
    	background-repeat:no-repeat;
    	background-position:top center;
    	background-color:#000;
    	-webkit-background-size: cover;
    	-moz-background-size: cover;
    	-o-background-size: cover;
    	background-size:cover;
    }


    und entferne den DOCTYPE ;)


    mfg. :thumbup:

    ast2ufdyxkb1.png


    Leute, lernt scripten und versucht mal lieber etwas selber zu schreiben, als es aus einem GF zu kopieren. :S

  • Danke erstmal.
    Ich habe quasi die Hintergrundgrafik, die ihre Größe nicht ändert , also mitskaliert. Das sieht man auch wenn man mal rauszoomt. Leider habe ich dadrüber noch mal die selbe Grafik, und die verändert ihre Größe.
    Zum verständnis kannst du ja mal drauf schauen.

  • Ich habe quasi die Hintergrundgrafik, die ihre Größe nicht ändert , also mitskaliert. Das sieht man auch wenn man mal rauszoomt. Leider habe ich dadrüber noch mal die selbe Grafik, und die verändert ihre Größe.


    Und mein Code würde dafür sorgen, dass dein Background-Image sich nicht mehr "mitskaliert" :D

    ast2ufdyxkb1.png


    Leute, lernt scripten und versucht mal lieber etwas selber zu schreiben, als es aus einem GF zu kopieren. :S

  • schau doch jetzt mal auf die seite da siehstes ja^^

  • man staunt, man staunt!
    es funktioniert!
    danke leute!