Um mein Homepage zu erstellen verwende ich den Dreamweaver CC, der kostenlos für ein Monat zur Verfügung gestellt wird.
Der Programmcode meiner Home Seite sieht wie folgt aus:
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<link href="assets/style.css" rel="stylesheet" type="text/css">
<title>Eva on Tour</title>
</head>
<!-- Start html block -->
<body>
<div id="wrapper">
<!-- =======================================
HEADER BEREICH
======================================= -->
<header>
<img src="assets/images/header.jpg" alt="Bild mit Ausblick über Linz. Rechts im Bild die Inhaberin der Homepage. Im Bild eingefügt ein Bereich mit Text und einem Mountainbike. Text: Eine Frau ein Bike ein Ziel...Eva on Tour"/>
</header>
<!-- =======================================
MENUE BEREICH
======================================= -->
<nav>
<ul >
<li id="current"> <a href="index.html" style="color: #B60F80"> <img src="assets/images/home-icon.png"> Home </a></li>
<li> <a href="uebermich.html"> <img src="assets/images/ich-icon.png"> Über mich </a> </li>
<li> <a href="touren.html"> <img src="assets/images/touren-icon.png"> Touren <span class="caret"></span></a>
<div>
<ul>
<li> <a href="touren-tour1.html"> Tour 1 </a> </li>
<li> <a href="touren-tour2.html"> Tour 2 </a> </li>
</ul>
</div>
</li>
<li> <a href="galerie.html"> <img src="assets/images/galerie-icon.png"> Galerie <span class="caret"></span> </a>
<div>
<ul>
<li> <a href="galerie-fotos.html"> Fotos </a> </li>
<li> <a href="galerie-videos.html"> Videos </a> </li>
</ul>
</div>
</li>
</ul>
</nav>
<!-- =======================================
CONTENT BEREICH
======================================= -->
<section class="content-index">
<article id="index">
<h6>Nächste Tour:</h6>
<b>Wann?</b> 02.03.2014, 14:00 Uhr
</br>
<b>Wo?</b> Biologiezentrum, Dornach
</br>
<b>Ziel?</b> Oberbairing
</article>
</section>
<!-- =======================================
FOOTER BEREICH
======================================= -->
<footer>
<div class="footer-right"><a href="kontakt.html"> Kontakt </a> </div>
</footer>
</div>
</body>
<!-- Ende html block -->
</html>
Wie hier ersichtlich ist, ist im Header ein Bild eingebunden.
Der Menü Bereich ist in 4 Hauptpunkte und bei 2 jeweils noch in Unterpunkte unterteilt. Damit die Schrift und der Icon die Farbe Berry hat sobald die Seite aktiv ist wird der jeweiligen li die id current zugeordnet und dem Link die Farbe Berry zugeordnet. Dadurch kann dies im CSS wie gewünscht angepasst werden.
Der Contetn Bereich wechselt von Seite zu Seite.
Der Footer ist wiederum bei allen Seiten gleich
Weiter Links zu diesem Thema:
... comment
Last update: 7. März, 14:55
Februar 2014 |
||||||
Mo |
Di |
Mi |
Do |
Fr |
Sa |
So |
1 |
2 |
|||||
3 |
4 |
6 |
7 |
8 |
9 |
|
10 |
11 |
12 |
13 |
14 |
15 |
16 |
17 |
18 |
19 |
20 |
21 |
22 |
23 |
24 |
25 |
26 |
||||
Um meine Menüleiste wie gewünscht umsetzen...
Füt meine Homepage benötige ich zwei sehr...
Ich habe mir zwei Entwürfe für die zu erstellende...
Für den Kurs Medienproduktion hatte ich mir, wie...
Da ich mich mehr und mehr mit der Erstellung meiner...
