HTML + CSS Frage , Danke für Antwort

05/31/2012 20:31 .Invaltion#1
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
05/31/2012 20:56 NotEnoughForYou#2
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
05/31/2012 21:31 Project Rivalry#3
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
05/31/2012 21:35 NotEnoughForYou#4
Quote:
Originally Posted by GAMER19951 View Post
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
05/31/2012 22:02 ooCheateroo#5
Quote:
Originally Posted by NotEnoughForYou View Post
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
05/31/2012 22:54 Fratyr#6
Quote:
Originally Posted by ooCheateroo View Post
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.

Quote:
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.

Quote:
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.
06/01/2012 14:25 .Invaltion#7
Danke für eure Antwortet ;) Ich versuche mein bestes :D
06/01/2012 16:19 PseudoPsycho#8
Quote:
Originally Posted by NotEnoughForYou View Post
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:
HTML Code:
background:url('images/Background.jpg') no-repeat;
/* je nach Streckart evtl. auch cover statt 100% */
background-size:100%;
06/01/2012 16:59 .Invaltion#9
Quote:
Originally Posted by PseudoPsycho View Post
Klar ist es das. Und zwar mit CSS3:
HTML Code:
background:url('images/Background.jpg') no-repeat;
/* je nach Streckart evtl. auch cover statt 100% */
background-size:100%;
Perfect :) Danke
06/01/2012 17:49 Mikesch01#10
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.
06/01/2012 19:15 PseudoPsycho#11
Quote:
Originally Posted by Mikesch01 View Post
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:
HTML Code:
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.
06/05/2012 22:01 マルコ#12
Ich habs zwar noch nicht getestet, sollte aber interessant sein:
[Only registered and activated users can see links. Click Here To Register...]

solche JS Biblotheken hab ich schon häufiger gesehen, die ermöglichen es älteren Browern, neuere Tags und Attribute trotzdem richtig darzustellen.
06/05/2012 22:19 Project Rivalry#13
mach ein bild größer ist als die größte auflösung und mach dann dem body das als bg