31 maja 2016

Menu nad nagłówkiem - nie jako strony


Witaj! Dzisiaj wstawię bardzo przydatną instrukcję, jak zrobić Menu nad nagłówkiem ale nie dodając go jako gadżet. W ten sposób możecie, zrobić dwa menu. Jeden jako strony np. pod nagłówkiem a drugi nad. A więc do dzieła!

1. W kodzie HTML szukamy "<header>" i pod podem wklejamy ten kod:

<style> @charset &#39;UTF-8&#39;; #menup, #menup ul, #menup li #menup a { list-style: none; margin: 0; padding: 0; border: 0; font-size: 13px; font-family: Arial; line-height: 1px; } #menup { width: 1500px; } #menup ul { background: transparent; -webkit-border-radius: 20px; -moz-border-radius: 20px; border-radius: 20px; border: none; } #menup ul:before { content: &#39;&#39;; display: block; } #menup ul:after { content: &#39;&#39;; display: table; clear: both; } #menup a, #menup a:link, #menup a:visited { padding: 10px 5px; display: block; text-decoration: none; color: #ffc0c1; font-weight: bold; } #menup a:hover { color: #ed8d94; } #menup li { float: left; } #menup li:hover { color: #ed8d94; } #menup li:first-child { padding-left: 150px; }</style>
<div id='menup'>
<ul>
<li><a href='LINK'><span>Nazwa strony</span></a></li>
<li><a href='LINK'><span>Nazwa strony</span></a></li>
<li><a href='LINK'><span>Nazwa strony</span></a></li>
<li><a href='LINK'><span>Nazwa strony</span></a></li>
<li><a href='LINK'><span>Nazwa strony</span></a></li>
<li><a href='LINK'><span>Nazwa strony</span></a></li>
<li><a href='LINK'><span>Nazwa strony</span></a></li>
<li><a href='LINK'><span>Nazwa strony</span></a></li>
</ul>
</div>
2. Zmieniamy Nazwy stron an własne a zamiast napisu "LINK" wklejamy link, do którego ma nas przekierowywać strona.
3. Zapisujemy i cieszymy się menu nad nagłówkiem.

źródło: introwertyczka1

Brak komentarzy:

Prześlij komentarz