Hallo alle zusammen!
Will grade meine erste richtige Hp nach Html-Seminar (großen Dank an Autor:hier hab ich mehr gelernt als in 3 Jahren Internet-AG inner Schule^^) machen und merke mal wieder dass ich immer noch blutige Anfängerin bin...
:oops:
Die Seite solln Abschiedsgeschenk fürne Freundin(liebt pink^^) werden, die inner Woche nach Frankreich fährt und jetzt hack' ich überall mit dem Design an:
-Wie bekomm ich die Navi- und die Infoleiste bis zum Boden(bis dahin wo der Text im Inhalt geht)?... is ja immer unterschiedlich, dh. ich kann net height benutzen^^
-Wie bekomm ich unterschiedliche Linkdefinitionen hin (will bei der Navi-leiste mit Links möglichst andere Farben nehmen, als bei der Steuerung)?
-Wie schaff ichs, dass man nur mit Passwort Zugang hat?
-Wie krieg ich einen Chat(Shoutbox) und ein Forum auf die HP?
usw. usw. usw. :cry:
also wenn ihr mir helfen könntet, wärs echt super nett,
hier kommt der Link:
http://www.lizzynet.de/home/kiki/
und hier einmal der Code vonner CSS-Datei:
body {
text-align:center;
}
#seitenbereich {
text-align: left;
margin: 0 auto;
width: 780px;
}
#kopfzeile {
width: 780px;
height: 50px;
background-image:url("kopfzeile.gif");
background-repeat:no-repeat;
background-position:center;
margin-bottom:0px;
}
#steuerung {
background-color:black;
color:#F80996;
text-align:center;
font-family:arial, "lucida console", sans-serif;
border:2px black groove;
width:600px;
margin-right:110px;
margin-left:125px;
margin: 0 auto;
}
#fusszeile {
width: 780px;
height: 20px;
background-image:url("fusszeile.gif");
background-repeat:no-repeat;
background-position:center;
border-top:2px solid black;
margin-bottom: 0px auto;
}
#navi {
background-color:#F80996;
padding: 0;
text-align:left;
margin-bottom: 0px;
width:125px;
float:left;
font-family:arial, "lucida console", sans-serif;
list-style-type:none;
}
#inhalte {
border:2px black groove;
background-color:#F8E6F1;
width:541px;
margin-right:110px;
margin-left:125px;
margin-top: 0px;
margin-bottom: 0px;
}
#infokasten {
float:right;
position:right;
width: 110px;
background-color:#F80996;
}
a:link{
color:#F8E6F1;
}
a:visited{
color:#F8E6F1;
}
a:active{
color:#F80996;
}
a:hover{
color:#F8E6F1;
background-color:#F80996;
}
h1 {
margin-top: 0px;
color:#F80996;
font-size:22pt;
text-align:center;
font-family:tahoma, "arial", "lucida console", sans-serif;
font-weight:bold;
}
h2 {
color:#C27C7C;
text-align:center;
line-height:2em;
letter-spacing:0.3em;
word-spacing:0.5em;
border-color:#872929;
border-width:10px;
border-top-style:solid;
border-left-style:solid;
}
.normal {
color:black;
font-size:12pt;
font-family:arial, "lucida console", sans-serif;
font-weight:bold;
font-style:italic;
text-indent:1em;
line-height:2em;
letter-spacing:0,3em;
}
.textmarkergelb {
background-color:yellow;
}
.textmarkerrot {
background-color:red;
}
Alles anzeigen
und einmal vom index:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<title> Just 4 Amy </title>
<link rel="stylesheet" href="design-ama2.css" type="text/css">
</head>
<body>
<div id="seitenbereich">
<div id="kopfzeile"></div>
<div id="navi">
<ul class="ul-ohne">
<li><a href="index.htm">Home</a></li>
<li><a href="friends.htm">Friends</a></li>
<li><a href="family.htm">Family</a></li>
<li><a href="schule.htm">Schulkrams</a></li>
<li><a href="chat.htm">Chatroom</a></li>
<li><a href="forum.htm">Forum</a></li>
</ul>
</div>
<div id="infokasten">
Hier stehn die News...
</div>
<div id="steuerung">
<a href="index.htm">Home |</a>
<a href="friends.htm"> Friends |</a>
<a href="family.htm"> Family |</a>
<a href="schule.htm"> Schulkrams |</a>
<a href="chat.htm"> Chatroom |</a>
<a href="forum.htm"> Forum |</a>
</div>
<div id="inhalte">
<h1>Willkommen, Amy,...</h1>
<font class="normal">
...auf deiner ganz persönlichen HP!<br/>
Hier sind auch in Frankreich alle für dich da: <br />
<ul>
<li>du kannst mit uns chatten oder ins Forum schreiben</li>
<li>du erfährst die wichtigsten Neuigkeiten</li>
<li>und verpasst nix vom Unterricht.</li>
</ul>
Viel Spaß!
</font>
</div>
<div id="fusszeile"> </div>
</div>
</body>
</html>
Alles anzeigen
Ps.: Das einzige was ihr mir nicht zu sagen braucht, ist, dass die Verweise nicht funktionieren...Das weiß ich selbst, die Dateien existieren noch nicht
Pps.: Mein "kostenloser Webspace"^^ is irgendwie komisch: man muss erst auf Home klicken, damit man/frau die Seite richtig sieht...
Naja also danke schonmal :wink:
die dödeline