Moderator: HTML-Laie
Oben sollen wieder Links hin und an der Seite eine kurze Navileiste....etwa 5-6 Punkte. Kümmere ich mich erst um den Hintergrund und dann die Navileiste oder wie??? Ich muss das ja auch mal alleine lernen.....helfen lassen ann man sich dann immer noch....
aber was solls ..eilt ja nicht....
Code: Alles auswählen
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Muster vorlage</title>
<style type="text/css">
<!--
body {
background-color: #000;
background-image: url(http://file1.npage.de/004305/55/bilder/hintergrund_beispiel.jpg);
background-attachment: fixed;
background-repeat: no-repeat;
background-position: center center;
}
#aussen {
width: 1012px;
margin-right: auto;
margin-left: auto;
background-color: #999;
}
#header {
width: 1012px;
background-color: #0FF;
height: 100px;
}
#balken {
width: 1012px;
background-color: #F6F;
height: 30px;
}
#navi {
float: left;
width: 200px;
background-color: #9F6;
}
#inhalt {
float: right;
width: 812px;
background-color: #F90;
}
#footer {
float: right;
width: 1012px;
background-color: #F33;
}
.clear {
clear: both;
}
=-->
<![endif]-->
</style>
</head>
<body>
<!-- Anfang des kompletten Container aussen-->
<div id="aussen">
Ich bin der Container aussen
<!--Anfang des Container Header-->
<div id="header">
Ich bin der Container Header
<!--Ende Container Header--></div>
<!-- Hier mache ich noch einen zwischenraum beim Header und dem Inhalt-->
<div id="balken">
Ich bin der Balken der zwischen Header und Main Contend bereich soll
<!--Ende Container Balken--></div>
<!-- Hier habe ich einen Container für die Navigation erstellt-->
<div id="navi">
<p>Navigation
<!-- Ende Container Navi-->
</p>
<p>Link 1 </p>
<p>Link 2</p>
<p>Link3 </p>
</div>
<!--Hier mache ich den Container für den Inhalt der Seite-->
<div id="inhalt">
<!-- Hier mache ich einen Conatiner für den eigentlichen Text Bereich-->
<div><script type="text/javascript">
<!--
document.write('<script type="text/javascript" src="/get_statistics.php?screen_width='+screen.width+'&screen_height='+screen.height+'&referrer='+document.referrer+'&userid=430555&page=79824231&no_count=1"><\/script>');
//-->
</script><script type="text/javascript" src="http://www.npage.de/javascript/userpages.js"></script><div class="jqDnR" id="idTextPanel">
<p style="font-family: Verdana,Geneva,sans-serif; font-style: normal; font-weight: normal; font-size: 10px; letter-spacing: normal; line-height: normal; text-transform: none; text-decoration: none; text-align: left;">Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu.</p>
<p style="font-family: Verdana,Geneva,sans-serif; font-style: normal; font-weight: normal; font-size: 10px; letter-spacing: normal; line-height: normal; text-transform: none; text-decoration: none; text-align: left;">In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam dictum felis eu pede mollis pretium. Integer tincidunt. Cras dapibus. Vivamus elementum semper nisi. Aenean vulputate eleifend tellus. Aenean leo ligula, porttitor eu, consequat vitae, eleifend ac, enim. Aliquam lorem ante, dapibus in, viverra quis, feugiat a, tellus.</p>
<p style="font-family: Verdana,Geneva,sans-serif; font-style: normal; font-weight: normal; font-size: 10px; letter-spacing: normal; line-height: normal; text-transform: none; text-decoration: none; text-align: left;">Phasellus viverra nulla ut metus varius laoreet. Quisque rutrum. Aenean imperdiet. Etiam ultricies nisi vel augue. Curabitur ullamcorper ultricies nisi. Nam eget dui. Etiam rhoncus. Maecenas tempus, tellus eget condimentum rhoncus, sem quam semper libero, sit amet adipiscing sem neque sed ipsum. Nam quam nunc, blandit vel, luctus pulvinar, hendrerit id, lorem. Maecenas nec odio et ante tincidunt tempus. Donec vitae sapien ut libero venenatis faucibus. Nullam quis ante. Etiam sit amet orci eget eros faucibus tincidunt. Duis leo. Sed fringilla mauris sit amet nibh. Donec sodales sagittis magna. Sed consequat, leo eget bibendum sodales, augue velit cursus nunc,</p>
</div>
<div class="jqDnR" id="idTextPanel">
<p style="font-family: Verdana,Geneva,sans-serif; font-style: normal; font-weight: normal; font-size: 10px; letter-spacing: normal; line-height: normal; text-transform: none; text-decoration: none; text-align: left;">Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu.</p>
<p style="font-family: Verdana,Geneva,sans-serif; font-style: normal; font-weight: normal; font-size: 10px; letter-spacing: normal; line-height: normal; text-transform: none; text-decoration: none; text-align: left;">In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam dictum felis eu pede mollis pretium. Integer tincidunt. Cras dapibus. Vivamus elementum semper nisi. Aenean vulputate eleifend tellus. Aenean leo ligula, porttitor eu, consequat vitae, eleifend ac, enim. Aliquam lorem ante, dapibus in, viverra quis, feugiat a, tellus.</p>
<p style="font-family: Verdana,Geneva,sans-serif; font-style: normal; font-weight: normal; font-size: 10px; letter-spacing: normal; line-height: normal; text-transform: none; text-decoration: none; text-align: left;">Phasellus viverra nulla ut metus varius laoreet. Quisque rutrum. Aenean imperdiet. Etiam ultricies nisi vel augue. Curabitur ullamcorper ultricies nisi. Nam eget dui. Etiam rhoncus. Maecenas tempus, tellus eget condimentum rhoncus, sem quam semper libero, sit amet adipiscing sem neque sed ipsum. Nam quam nunc, blandit vel, luctus pulvinar, hendrerit id, lorem. Maecenas nec odio et ante tincidunt tempus. Donec vitae sapien ut libero venenatis faucibus. Nullam quis ante. Etiam sit amet orci eget eros faucibus tincidunt. Duis leo. Sed fringilla mauris sit amet nibh. Donec sodales sagittis magna. Sed consequat, leo eget bibendum sodales, augue velit cursus nunc,</p>
</div>
<p> </p>
<div class="jqDnR" id="idTextPanel">
<p style="font-family: Verdana,Geneva,sans-serif; font-style: normal; font-weight: normal; font-size: 10px; letter-spacing: normal; line-height: normal; text-transform: none; text-decoration: none; text-align: left;">Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu.</p>
<p style="font-family: Verdana,Geneva,sans-serif; font-style: normal; font-weight: normal; font-size: 10px; letter-spacing: normal; line-height: normal; text-transform: none; text-decoration: none; text-align: left;">In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam dictum felis eu pede mollis pretium. Integer tincidunt. Cras dapibus. Vivamus elementum semper nisi. Aenean vulputate eleifend tellus. Aenean leo ligula, porttitor eu, consequat vitae, eleifend ac, enim. Aliquam lorem ante, dapibus in, viverra quis, feugiat a, tellus.</p>
<p style="font-family: Verdana,Geneva,sans-serif; font-style: normal; font-weight: normal; font-size: 10px; letter-spacing: normal; line-height: normal; text-transform: none; text-decoration: none; text-align: left;">Phasellus viverra nulla ut metus varius laoreet. Quisque rutrum. Aenean imperdiet. Etiam ultricies nisi vel augue. Curabitur ullamcorper ultricies nisi. Nam eget dui. Etiam rhoncus. Maecenas tempus, tellus eget condimentum rhoncus, sem quam semper libero, sit amet adipiscing sem neque sed ipsum. Nam quam nunc, blandit vel, luctus pulvinar, hendrerit id, lorem. Maecenas nec odio et ante tincidunt tempus. Donec vitae sapien ut libero venenatis faucibus. Nullam quis ante. Etiam sit amet orci eget eros faucibus tincidunt. Duis leo. Sed fringilla mauris sit amet nibh. Donec sodales sagittis magna. Sed consequat, leo eget bibendum sodales, augue velit cursus nunc,</p>
</div><!-- START adgoal v3.0 -->
<script type="text/javascript">
// var ao_subid = "";
var atSlCgHost = (("https:" == document.location.protocol) ? "https://" : "http://");
document.write(unescape("%3Cscript src='" + atSlCgHost + "js.smartredirect.de/js/?h=RJ7KyGm7' type='text/javascript'%3E%3C/script%3E"));
</script>
<!-- ENDE adgoal v3.0 --><script type="text/javascript"
src="http://count.asnetworks.de/count.js">
</script>
<script type="text/javascript"><!--
// 27.05.2010
asn_site_id = "94";
asn_zone_id = "3";
asn_no_referrer = "npage.de, npage.at, npage.ch, npage.eu, de.to";
Track();
//-->
</script></div>
<!-- Ende Container Inhalt--></div>
<!-- Noch einen Container für die Fusszeile wenn gewünscht-->
<div id="footer">
Ich bin der Footer der Webseite
<!-- Ende des Container Footer--></div>
<!-- Beim Container aussen muss man clear anwenden das der Container sonst nicht mit in die länge gezogen wird-->
<br class="clear" />
<!-- Ende Container aussen--></div>
</body>
</html>
Mitglieder in diesem Forum: 0 Mitglieder und 2 Gäste