CSS Frage: Header auf anderes Bild kopieren ;)

lima-city → Forum → Die eigene Homepage → HTML, CSS & Javascript

Autor dieses Themas

~~b****g~~

22:28, 26.8.2010

Hallo Leute,

ich wollte mir so ne art blog wie hier http://ocube.bplaced.net/ erstellen, ich hab schon den unterteil aber ich weiß nicht wie man den header richtig draufkriegt. mein css sieht aktuell so aus:

body {
	background-color: #009fe3;
}

#content_large{
z-index:3;
position:static; 


margin-left: auto;
margin-right: auto;
margin-top:225px;
margin-bottom:-100px;

clear:both;

top:225px;
left:expression(this.parentNode.clientWidth/2 - this.clientWidth/2 + " px");
}

und mein index.php

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<link rel="stylesheet" href="style.css" type="text/css" />
<title>nicest places</title>
</head>

<body>

<center>
<div id="content_large">
<img src="body.png">
</div>
</center>
</body>
</html>

Danke im Voraus ;)

Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

lima-city: Gratis werbefreier Webspace für deine eigene Homepage

nemoinho

nemoinho hat kostenlosen Webspace.

10:45, 27.8.2010

ich bin grade wach geworden und hab jetzt erst den Titel verstanden, du willst, so nehme ich an, die seite, der Seite einen Header geben, so ähnlich wie das in der Beispielseite ist, warum machst du da dann nicht sowas:

<body>
  <div id="header">
    <ul>
      <li>Foo
        <ul>
          <li><a href="bar">Bar</a></li>
        <ul>
      </li>
    </ul>
  </div>
  <div id="main">
    <p>Ganz viel Inhalt</p>
  </div>
  <div id="footer">
    <adress>
      <a href="impress">Impresssum</a> - <a href="info">Info</a>
    </adress>
  </div>
</body>

Das ist ein ganz einfaches HTML um das ganze mal logisch zu strukturieren, dazu braucht man dann nur noch etwas CSS um das zu layouten:

* { margin:0; padding:0; }
#header, footer { margin:0 auto; }
#main { margin:-10px auto; padding:20px 10px; background:url(KA.png); width:BG_BREITE; }
#header { background:url(KA.png); width:BG_BREITE; height:BG_HÖHE; z-index:10; position:relative;}
#footer { background:url(KA.png); width:BG_BREITE; height:BG_HÖHE; }

Das sollte erstmal reichen, damit du siehst, wie es geht, das Menü und ähnliches musst du dir dann schon selbst raussuchen.

Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

lima-city: Gratis werbefreier Webspace für deine eigene Homepage

Dir gefällt dieses Thema?

Über lima-city

lima-city bietet dir kostenlosen und werbefreien Speicherplatz für Deine Homepage. Sofort anmelden und direkt loslegen mit Webspace, PHP, Datenbanken, günstigen Domains und einer tollen Community!

kostenloser Webspace werbefrei: lima-city