Seite 1 von 1

Hintergrundbild über ganze Webseite

Verfasst: So 12. Jan 2020, 11:54
von weev
Hallo, ich habe für meine Webseite ein Hintergrundbild. Obwohl ich das jpg-Bild größer gemacht habe füllt es den Hintergrund nicht ganz aus.
background-image: url('pictures/oldman.jpg'); position: relative; background-attachment: scroll; background-repeat: no-repeat; background-color: #FFFFFF;
ich habe es mit expression web 4 gemacht. in dem Programm ist es über die ganze Seite! im Kompozer ist es allerdings auch nicht ganz aus gefüllt:
background-image: url(pictures/oldman.jpg);
position: relative;
background-attachment: scroll;
background-repeat: no-repeat;
background-color: #ffffff;
left: 0px;
top: 0px;
width: 871px;
margin-right: 118px;
Weiß einer von Euch was ich tun kann?
MfG Frank

Re: Hintergrundbild über ganze Webseite

Verfasst: So 12. Jan 2020, 13:34
von camouflage1984
Hallo Frank

Könnte daran liegen:
weev hat geschrieben:
So 12. Jan 2020, 11:54
margin-right: 118px;
Hast du den Abstand eingetragen?

LG
Dimi

Re: Hintergrundbild über ganze Webseite

Verfasst: So 12. Jan 2020, 19:08
von weev
Das mit den 118 px? Nein. wüste nicht wo man das in expression macht.

Re: Hintergrundbild über ganze Webseite

Verfasst: Di 14. Jan 2020, 16:42
von weev
Hi, ich habe es in expression heraus genommen. Jetzt funktioniert es auf den Smartphones. Auf dem PC bleibt aber noch ein streifen bei placeofmemories.net
Vielleicht sollte ich es mit dem cover versuchen, weiß aber darüber zu wenig.
weev

Re: Hintergrundbild über ganze Webseite

Verfasst: So 19. Jan 2020, 04:23
von camouflage1984
Hallo weev,

Code: Alles auswählen

background-size: cover;
ist leider css 3 und wird von Kompozer gelöscht wenn er es im html Dokument findet!


Deine Seite sieht bei mir auf einem 27" Bildschirm so
27.jpg
27.jpg (7.14 KiB) 13311 mal betrachtet
aus.

Damit dein hintergrundbild als cover angezeigt und von Kompozer nicht gelöscht wird musst du folgendes machen:

Das ist der css-code den du einfügen musst.

Code: Alles auswählen

html, body {margin:0; padding:0; width:100%; height:100%; overflow:hidden;}
#background{position:absolute;  width:100%; height:100%; z-index:1;}
#content_wrapper{position:absolute; width:100%; height:100%; top:0; left:0; overflow:auto; z-index:2;}
#content{width:960px; height:500px; margin: 0 auto;  }

Code: Alles auswählen

	
	<body>
<div>
<img src="pictures/oldman.jpg" id="background" /></div> <!-- Zeile 1 -->
   <div id="content_wrapper"> <!-- Zeile 2 -->
 <div id="content">  <!-- Zeile 3 -->
<!--  Hier kommt der Inhalt deiner Seite hinein -->
</div>
</div>
 
  
Ergebnis