2016-11-01 7 views
-4

Ich habe ein Problem und ich weiß nicht, wie ich es lösen soll, ich bin wirklich ein Anfänger. Ich versuche eine Navigationsleiste zu erstellen und den Abstand zwischen Navigationspunkten zu reduzieren, aber ich bin so erfolglos. hier ist das, was ich habe: my menuCSS horizontale Navigationsleiste

, und ich möchte das Gewürz zwischen sie reduzieren und so etwas wie haben:

enter image description here

+3

Willkommen bei Stack Overflow! Es wird erwartet, dass Sie zumindest versuchen, dies für sich selbst zu programmieren. Stack Overflow ist kein Code-Schreibdienst. Ich würde vorschlagen, dass Sie einige [** zusätzliche Forschung **] (http://meta.stackoverflow.com/questions/261592/how-much-research-effort-is-sected-of-stack-overflow-users) tun entweder über Google oder durch die Suche nach SO, versuchen und. Wenn Sie immer noch Probleme haben, kommen Sie zurück mit ** Ihrem Code ** und erklären Sie, was Sie versucht haben. –

+2

Sie müssen Ihren Code posten, nicht Bilder von dem, was er tut. – TheValyreanGroup

Antwort

0

ul { 
 
    list-style-type: none; 
 
    margin: 0; 
 
    padding: 0; 
 
    overflow: hidden; 
 
    background-color: #333; 
 
} 
 
li { 
 
    float: left; 
 
} 
 
li a { 
 
    display: block; 
 
    color: white; 
 
    text-align: center; 
 
    padding: 14px 16px; 
 
    text-decoration: none; 
 
} 
 
li a:hover:not(.active) { 
 
    background-color: #111; 
 
} 
 
.active { 
 
    background-color: #4CAF50; 
 
}
<ul> 
 
    <li><a class="active" href="#home">Home</a> 
 
    </li> 
 
    <li><a href="#news">News</a> 
 
    </li> 
 
    <li><a href="#contact">Contact</a> 
 
    </li> 
 
    <li><a href="#about">About</a> 
 
    </li> 
 
</ul>

https://jsfiddle.net/nmttg009/