HTML + CSS Frage , Danke für Antwort

[.Invaltion]

Mein Problem ist , das sich mein Hintergrundbild kachelt und sich nicht an mein Display anpasst.

Könnte mir mal bitte jemand ERKLÄREN warum ?

Code:

@charset "utf-8";
/* CSS Document */



.center {
width:1000px;
height:auto ;
margin: 500px auto;
background-color: rgba(153,153,153,0.3);
font-size: 13px;



}

#header {

text-align:center;
color:#FF66CC

}







#Background {
background:url(images/Background.jpg);



}

-------------------



Danke für eure Hilfe

[NotEnoughForYou]

du meinst, dass sich das bild wiederholt ? das "strecken" der bilder ist mit html bzw css nicht machbar. Eine genauere beschreibung ujd was du genau erreichen willst waere gut

[Project Rivalry]

du müsstes repeat hinter das bild schreiben dann füllt es den ganzen bildschirm wen du das willst.. wen du aber nur ein bild hast empfehle ich dir einen verlauf in eine farbe und dann die hintergrund farbe anzupassen

[NotEnoughForYou]

Originally Posted by GAMER19951

du müsstes repeat hinter das bild schreiben dann füllt es den ganzen bildschirm wen du das willst.. wen du aber nur ein bild hast empfehle ich dir einen verlauf in eine farbe und dann die hintergrund farbe anzupassen

ohne repeat angabe wiederholt es sich automatisch, alllerdings nicht den ganzen bg sondern nur das div background

[ooCheateroo]

Originally Posted by NotEnoughForYou

Das "strecken" der bilder ist mit html bzw css nicht machbar.

Kann man das nicht machen (Also im CSS), indem man height: 100%; und width: 100%; benutzt? Aber naja das Bild kann dann aber auch dadurch verzerrt werden, wenn der Content oder die Bildschirmgröße sehr groß sind.

mfg

[Fratyr]

Originally Posted by ooCheateroo

Kann man das nicht machen (Also im CSS), indem man height: 100%; und width: 100%; benutzt? Aber naja das Bild kann dann aber auch dadurch verzerrt werden, wenn der Content oder die Bildschirmgröße sehr groß sind.

mfg

Jein. Du kannst einen img tag verwenden mit der Höhen und Breiten Angabe von 100% und seinen Content mit einer absoluten Position über das Bild setzen.

du müsstes repeat hinter das bild schreiben dann füllt es den ganzen bildschirm wen du das willst.. wen du aber nur ein bild hast empfehle ich dir einen verlauf in eine farbe und dann die hintergrund farbe anzupassen

Sagmal wollt ihr mich alle verarschen? Du prahlst in deiner Signatur mit 7 von 10 im Bereich HTML5 und kennst nichteinmal den oben genannten "Fix" für dieses Problem? Du meinst du hast einen Skill von 8/10 im Bereich CSS und weißt nichteinmal was background-repeat bewirkt?
Hört verdammt nochmal auf die Leute zu verarschen in dem ihr mit überzogenen Fähigkeiten in eurer Signatur prahlt ohne auch nur den Hauch einer Ahnung davon zu haben. CSS3 bietet übrigens auch die Möglichkeit ein Hintergrundbild zu strecken, da ihr euch alle daran aufgeilt mal ein oder zwei HTML5 Tags oder CSS3 Eigenschaften zu kennen sollte euch das eigentlich bekannt sein, und nicht so einen Stuss von euch geben.

Auserdem passen deine Angaben von JavaScript und HTML5 nicht ganz zusammen, da HTML5 zu beinahe 95% aus einer neuen JavaScript Version mit dem Fokus auf Canvas und neien Selektoren besteht.

Das "strecken" der bilder ist mit html bzw css nicht machbar.

Nein, der img Tag ist dazu fähig Bilder zu strecken und zu verkleinern.

[.Invaltion]

Danke für eure Antwortet Ich versuche mein bestes

[PseudoPsycho]

Originally Posted by NotEnoughForYou

du meinst, dass sich das bild wiederholt ? das "strecken" der bilder ist mit html bzw css nicht machbar

Klar ist es das. Und zwar mit CSS3:

background:url('images/Background.jpg') no-repeat;
/* je nach Streckart evtl. auch cover statt 100% */
background-size:100%;

[.Invaltion]

Originally Posted by PseudoPsycho

Klar ist es das. Und zwar mit CSS3:

background:url('images/Background.jpg') no-repeat;
/* je nach Streckart evtl. auch cover statt 100% */
background-size:100%;

Perfect Danke

[Mikesch01]

Die CSS3 Eigenschaft geht aber hauptsächlich nur auf den neusten Browser und bei IE erst ab 9 aufwärts. Ältere Browser zeigen dir das unskalierte Bild an.

[PseudoPsycho]

Originally Posted by Mikesch01

Die CSS3 Eigenschaft geht aber hauptsächlich nur auf den neusten Browser und bei IE erst ab 9 aufwärts. Ältere Browser zeigen dir das unskalierte Bild an.

Nja, klar. Ist ja auch das "neue" CSS.

Wär wohl sinnvoll, das Bild noch zu positionieren, damit es in dem Fall nicht ganz so schlimm aussieht:

background:rgb(0, 0, 0) url('images/Background.jpg') no-repeat;
/* je nach Streckart evtl. auch cover statt 100% */
background-size:100%;
background-position:center top;

Dann wird das Bild im Falle eines alten Browsers wenigstens zentriert.
Empfehlenswert wäre also dennoch eine Standard-Bilschirmgröße für das Bild.

[マルコ]

Ich habs zwar noch nicht getestet, sollte aber interessant sein:


solche JS Biblotheken hab ich schon häufiger gesehen, die ermöglichen es älteren Browern, neuere Tags und Attribute trotzdem richtig darzustellen.

[Project Rivalry]

mach ein bild größer ist als die größte auflösung und mach dann dem body das als bg