Wie passe ich meine Seite an?

Bazs

Guten Abend Community,ich versuche die ganze Zeit meine Seite wie auf den folgenden Screen anzupassen aber bei mir sieht es nicht so aus wie ichs wollte, hier erstmal die screens:So soll es aussehen:[Blockierte Grafik: https://u-labs.de/attachments/html-99/8470d1420722988-wie-passe-ich-meine-seite-cjhdh.jpg][/SPOILER]So sieht es aber aus:[Blockierte Grafik: https://u-labs.de/attachments/html-99/8471d1420723015-wie-passe-ich-meine-seite-my_technobase_1920x108v743.jpg]Der HTML Code (den hat mein Kollege so erstellt) sieht folgendermaßen aus:

PHP

<?php$page = $_GET['page'];
if ($page == "") { echo $page = "";}
?>
<!DOCTYPE HTML>
<html>
<head>
<meta charset="UTF-8">
<title>Teccistopia</title>
<link rel="stylesheet" href="css/style.css" type="text/css">
<script src="js/snow.js" type="text/javascript"></script>
</head>
<body>
<div>
<div id="menu">
<a href="index.php?page=home" class="logo"><img src="https://u-labs.de/images/banner.png" alt=""></a>
</div>
<a style="color:#FF5D00; float:right; font-size:22px;" href="/forum/"> Projekte</a>
<a style="color:#FF5D00; float:right; font-size:22px;" href="#">|</a>
<a style="color:#FF5D00; float:right; font-size:22px;" href="#"> Finanzierung </a>
<a style="color:#FF5D00; float:right; font-size:22px;" href="#">|</a>
<a style="color:#FF5D00; float:right; font-size:22px;" href="#"> Team </a>
<a style="color:#FF5D00; float:right; font-size:22px;" href="#">|</a>
<a style="color:#FF5D00; float:right; font-size:22px;" href="#"> Server </a>
<a style="color:#FF5D00; float:right; font-size:22px;" href="#">|</a>
<a style="color:#FF5D00; float:right; font-size:22px;" href="#">Startseite </a>
</div>
<div id="includearea" style="margin: 0 auto;">
<?php 
?>
</div>
<div style="position:absolute; bottom:10px; background-color:#0094FF; opacity:0.5; filter:alpha(opacity=30); width:100%; 




id=footer">
<p>Copyright (C) 2014-2015 Domenik Landgraf. All rights reserved.</p>
</div>
</body>
</html>

Alles anzeigen

Hoffentlich könnt ihr mir helfen :xDie Orange farbigen Punkte sollen Social Icons sein sprich Facebook, Twitter und Google.

Ajoerg

oben rechts die links muss die schrittweite und größe eingestellt werden,
statt 'snow' ggf. 'sterne' als .js-datei,
das logo evtl in einer besseren auflösung/farbe,
das copyright farblich anpassen,
die links neben dem copyright wie die anderen links,

oder willst du nen neuen quellcode ?

Bazs

Also der Schnee ist gewollt, das Problem ist, ich habe alles richtig geordnet beim Menü aber dieser ballert mir die einzelnen Seiten falsch ein, so wie es beim screen steht, steht es nur weil ich von hinten anfing das Menü einzufügen, nachher poste ich mal die stylesheet.

Das gleiche Problem habe ich aber auch beim copyright, das ist viel zu hochgezogen obwohl das angepasst sein müsste, ich kann auch keine Leerzeichen beim Menü einfügen, egal ob <p> oder <br>, es steht untereinander was es halt nicht soll, möchte es ja getrennt haben wie beim screen

Bandit

Ein Link zur Seite wäre nicht schlecht

djheke

PHP

<!DOCTYPE HTML>
<html>
<head>
<meta charset="UTF-8">
<title>Teccistopia</title>
<link rel="stylesheet" href="css/style.css" type="text/css">
<script src="js/snow.js"></script>


<style>
* {
 margin:0;
 padding:0;
}


html,body {
 height:100%;
}


html {
 background:#333;
}


body {
 width:90%;
 margin:0 auto;
 position:relative;
 background:#000;
}


header {
 overflow:hidden;
 }


#logo {
 float:left;
}
nav {
 text-align:right;
}
nav a {
 color:#F50; 
 display:-inline-block; 
 font-size:22px; 
 padding:5px 5px 5px 0;
 font-weight:bold;
 text-decoration:none;
 vertical-align:top;
 
}


#footer {
 position:absolute;
 bottom:10px;
 padding:10px 0;
 background-color:#00a; 
 color:#F50; 
 width:100%;
 font-weight:bold;
} 


#footer a , #footer p {
 float:left; 
  padding:5px;
 font-weight:bold;
 font-size:75%;
 text-decoration:none;
 vertical-align:top; 
 color:#F50; 
}


#footer p { 
 margin-right:20px;
}
#footer :nth-child(4) { 
 margin-left:40px; 
}
</style>
</head>
<body>
<header>
<div id="logo"><a href="index.php?page=home" class="logo"><img src="" width="300" height="60"alt=""></a></div>
<nav>
<a href="#">Startseite |</a>
<a href="#">Server |</a>
<a href="#">Team |</a>
<a href="#">Finanzierung |</a>
<a href="/forum/">Projekte</a>
</nav>
</header>
<div id="includearea" >
<?php 
?>
</div>
<div id="footer">
<p>Copyright (C) 2014-2015 Domenik Landgraf. All rights reserved.</p>
<a href="#">Impressum |</a>
<a href="#">Datenschutzerklärung</a>
<a href="#">Partner |</a>
<a href="#">Sponsoren</a>
</div>


</body>
</html>

Alles anzeigen

Bazs

http://www.teccistopia.de/demo das ist die Seite.

Habe nur bei den Code von djhecke das Problem, das kein Hintergrund da ist.

djheke

Upps! Mach mal aus <head></head> innerhalb von body ein <header></header> und im css auch.

Bazs

/e2: Hintergrund habe ich hinbekommen

/e:

habe nun auch das Problem, will Ab Impressum alles nach rechts verschoben haben, habe einiges ausprobiert, aber alles schlug fehl, was genau soll ich machen, bin wirklich ein mieser einsteiger in HTML xD

/e3: habe auch dies hinbekommen, bin doch nicht so dumm wie ich dachte

Wie passe ich meine Seite an?

Tags

Benutzer online in diesem Thema