• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Hintergrundbild anpassen, aber wie?

H

HomepageTerror

Neues Mitglied
Also ich benutze für meine Homepage die Oyla Vorlage. Aber der Hintergrundbild ist auf jedem Computer anders angepasst. Ich habe schon irgendtwie alles probiert um es auf jedem Computer gleich zu bekommen. Ich möchte gern mein Hintergrundbild in die Mitte positionieren. Ich bitte um Hilfe ! :(





Mein Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

<html>
<head>
<title>%titel%</title>
<style type="text/css">
<!--
body {
position: absolute;
padding: 0;
margin: 0;
top: 0;
left: 0;
background-color: #ffffff;
scrollbar-face-color: #ffffff;
scrollbar-highlight-color: #000000;
scrollbar-3dlight-color: #000000;
scrollbar-darkshadow-color: #000000;
scrollbar-shadow-color: #000000;
scrollbar-arrow-color: #000000;
scrollbar-track-color: #ffffff;
}
img#design {
position: absolute;
top: 0;
left: 0;
border: none;
}
div.content {
overflow: auto;
position: absolute;
top: 260px;
left: 330px;
width: 630px;
height: 220px;
font-family: Arial;
font-size: 16px;
color: #000000;
}
div.navigation {
overflow: auto;
position: absolute;
top: 260px;
left: 40px;
width: 185px;
height: 220px;
font-family: Arial;
font-size: 16px;
color: #000000;
}
a:link {
color: #0000ff;
text-decoration:none;
}
a:visited {
color: #0000ff;
text-decoration:none;
}
a:active {
color: #ffffff;
text-decoration:none;
}
a:hover {
color: #000000;
text-decoration:none;
}
-->
</style>
</head>

<body>

<!-- Start Design -->
<img src="Design_Adresse.jpg" alt="Designbild" id="design" />
<!-- End Design -->

<!-- Start Content -->
<div class="content">
%content%
</div>
<!-- End Content -->

<!-- Start Navigation -->
<div class="navigation">
%navigation_v%
</div>
<!-- End Navigation -->

</body>

<!--
Dies ist der Grundcode von Oylahomepagehilfe.de - Letztes Update am: 19.08.2009.
Dieser Hinweis darf ohne Genehmigung von einem Betreiber des Internetabgebotes nicht entfernt werden.
-->

</html>
 
Hallo,

soll das hier dein hintergrundbild sein?
Code: 
<!-- Start Design -->
<img src="Design_Adresse.jpg" alt="Designbild" id="design" />
<!-- End Design -->

Wenn ja muss ich leider Sagen der code ist eigentlich schrottich und sollte eigentlich nicht als Muster veröffentlicht werden selbst 2009 war der schon falsch :O).
aber egal.

Nimm das bild raus und mach ersetzte das.
Code: 
body {
position: absolute;
padding: 0;
margin: 0;
top: 0;
left: 0;
background-color: #ffffff;
scrollbar-face-color: #ffffff;
scrollbar-highlight-color: #000000;
scrollbar-3dlight-color: #000000;
scrollbar-darkshadow-color: #000000;
scrollbar-shadow-color: #000000;
scrollbar-arrow-color: #000000;
scrollbar-track-color: #ffffff;
}
in das
Code: 
body {
 position: absolute;
 padding: 0;
 margin: 0;
 top: 0;
 left: 0;
 background-color: #ffffff;
 scrollbar-face-color: #ffffff;
 scrollbar-highlight-color: #000000;
 scrollbar-3dlight-color: #000000;
 scrollbar-darkshadow-color: #000000;
 scrollbar-shadow-color: #000000;
 scrollbar-arrow-color: #000000;
 scrollbar-track-color: #ffffff;
 background-attachment: fixed;
 background-image: url(Design_Adresse.jpg);
 background-repeat: no-repeat;
 background-position: center center;
}

Cheffchen
 
Vielen, Vielen Dank :)
Jetzt habe ich noch eine weitere Frage und zwar möchte ich die beiden Codes auch in die Mitte bekommen aber wie?

<!-- Start Content -->
<div class="content">
%content%
</div>
<!-- End Content -->

<!-- Start Navigation -->
<div class="navigation">
%navigation_v%
</div>
<!-- End Navigation -->
 
Hallo,

Jetzt habe ich noch eine weitere Frage und zwar möchte ich die beiden Codes auch in die Mitte bekommen aber wie
Zum Vergrößern anklicken....
äh.
was verstehst du unter "in der mitte bekommen". (rechts/links) oder (oben/unten) ausgerichtet.
oben/unten geht aber nur wenn der inahlt eine feste höhe hat auf allen seiten, was bei dein beispiel jetzt 220px wäre. dies macht man eigentlich nicht da es doch sehr den inhalt einschränkt.
rechts/links, ist eigentlich standard heute das die Seite auf großen bildschirmen nicht so verloren in der ecke hängt.

ps: wenn das noch änderst bleibt eigentlich nichts mehr von dem falschen code übrig :O)

Cheffchen
 
Also ich möchte den Code den ich bereits zugepostet habe so stellen, das wenn ich den Text bearbeite das er genau in der Mitte zu erscheinen ist genau so wie der Hintergrund.. :)
 
Hallo,

kann sein das meine frage nicht beäntwortest hast :O).

HTML: 
<div style="
 position:absolute;
 height:220px; 
 width:630px;
 margin:-110px 0px 0px -315px;
 top: 50%; 
 left: 50%;
 background-color: #f5f5f5;
 border: 1px dotted #000000;">
Text. Wirklich vertikal und horizontal zentriertes div!
</div>

oben/unten zentriert macht man aber nicht, hab mein einwand ja schon geschrieben wieso aber die erfahrung musst halt selber machen :O).

Cheffchen
 
Also dies ist mein Content - Code !

Code:

}
div.content {
overflow: auto;
position: absolute;
top: 260px;
left: 330px;
width: 630px;
height: 220px;
font-family: Arial;
font-size: 16px;
color: #000000;
}


Aber mit diesem Code ist der Content (Text) wenn ich (left) einstelle auf jedem Computer bzw. Brwoser anders positioniert, denn es verschiebt sich je nach Größe und passt dann mit dem Hintergrund bild nicht überein. Das Problem ist das bei der (left) Einstellung, das Content von ganz links anfängt. Hätte man vielleicht eine Möglichkeit das der Text genau in der Mitte liegt, sodass ich von da aus (left) einstellen kann? Denn dann ist es auch in jedem Brwoser bzw. Pc gleich positioniert und stimmt mit dem Background überein.
Hoffe mich klar ausgedrückt zu haben ! :)

Liebe Grüße, HomepageTerror !
 
Du musst dich einloggen oder registrieren, um hier zu antworten.

Neueste Beiträge

Zurück
Oben