1. Zwiększamy obszar strony do 1200px, wprowadzamy kolumnę MENU o 180px szerokości reszta wg wzoru:
2. Dodajemy elementy menu wg wzoru:
3. Dodajemy czcionkę z Google Fonts.
4. Formatujemy menu:
ul { list-style-type: none; margin: 0; padding: 0; overflow: hidden; }
5. Formatujemy odnośnik:
li a { display: block; color: white; text-align: left; padding: 10px; text-decoration: none; background-color: #ddd; }
6. Formatujemy zachowanie odnośników po najechaniu kursorem i zaznaczeniu, np.:
/* unvisited link */ a:link { color: green; } /* visited link */ a:visited { color: green; } /* mouse over link */ a:hover { color: red; } /* selected link */ a:active { color: yellow; }