CSS Border Top funktioniert nicht

Question

Ich habe versucht, eine Grenze oben auf eine Reihe von Hyperlinks setzen, um sie vom Titel (für eine Hausaufgabe) zu trennen, aber es funktioniert nicht und ich versuche das seit über einer Stunde bereits.

Dies ist der CSS-Code des #menu die meine Hyperlinks enthält:

#menu { 
 
    color: #ffffff; 
 
    padding: 10px 0px 10px 0px; 
 
    text-align: center; 
 
    border-top: 1px #669999; 
 
}

<div id="menu"> 
 
    <a href="#">HYPERLINK 1</a>&nbsp;&nbsp;|&nbsp;&nbsp; 
 
    <a href="#">HYPERLINK 2</a>&nbsp;&nbsp;|&nbsp;&nbsp; 
 
    <a href="#">HYPERLINK 3</a>&nbsp;&nbsp;|&nbsp;&nbsp; 
 
    <a href="#">HYPERLINK 4</a>&nbsp;&nbsp;|&nbsp;&nbsp; 
 
    <a href="#">HYPERLINK 5</a> 
 
</div>

Das ist das Bild, wie es aussieht. (Ja ich weiß, es ist hässlich, aber ich muss mit den Anweisungen arbeiten)

Answer 1

Sie müssen solid dazwischen verwenden, sonst hat der Standardwert nichts.

border-top: 1px solid #669999; 

Überprüfen Sie die Anfangswerte sein:

Arbeits Snippet

#menu { 
 
    color: #ffffff; 
 
    padding: 10px 0px 10px 0px; 
 
    text-align: center; 
 
    border-top: 1px solid #669999; 
 
}

<div id="menu"> 
 
    <a href="#">HYPERLINK 1</a>&nbsp;&nbsp;|&nbsp;&nbsp; 
 
    <a href="#">HYPERLINK 2</a>&nbsp;&nbsp;|&nbsp;&nbsp; 
 
    <a href="#">HYPERLINK 3</a>&nbsp;&nbsp;|&nbsp;&nbsp; 
 
    <a href="#">HYPERLINK 4</a>&nbsp;&nbsp;|&nbsp;&nbsp; 
 
    <a href="#">HYPERLINK 5</a> 
 
</div>

Und nein t eine gute Idee,   für Auslegezwecke zu verwenden. Versuchen Sie margin mit:

#menu { 
 
    color: #ffffff; 
 
    padding: 10px 0px 10px 0px; 
 
    text-align: center; 
 
    border-top: 1px solid #669999; 
 
} 
 

 
#menu a { 
 
    margin: 10px; 
 
}

<div id="menu"> 
 
    <a href="#">HYPERLINK 1</a> | 
 
    <a href="#">HYPERLINK 2</a> | 
 
    <a href="#">HYPERLINK 3</a> | 
 
    <a href="#">HYPERLINK 4</a> | 
 
    <a href="#">HYPERLINK 5</a> 
 
</div>

Answer 2

Ihre border Syntax falsch ist, ist die Art des border fehlt,

<br-width> || <br-style> || <color>

prüfen border Syntax here

sein sollte

Hinweise

•   nicht statt margin in CSS
• gemeint, Räume zu schaffen, verwende ich Ihre padding und Ihre Hex-Farben verkürzte

---

body { 
 
    background: darkgreen 
 
} 
 
#menu { 
 
    color: #fff; 
 
    padding: 10px 0; 
 
    text-align: center; 
 
    border-top: 1px solid #699; 
 
} 
 
#menu a { 
 
    margin: 0 5px; 
 
    color:#fff 
 
}

<div id="menu"> 
 
    <a href="#">HYPERLINK 1</a>| 
 
    <a href="#">HYPERLINK 2</a>| 
 
    <a href="#">HYPERLINK 3</a>| 
 
    <a href="#">HYPERLINK 4</a>| 
 
    <a href="#">HYPERLINK 5</a> 
 
</div>

Answer 3

Ihre border-top is-Eigenschaft fehlt das border-style-Attribut. Versuche Folgendes. https://developer.mozilla.org/en/docs/Web/CSS/border-top

#menu { 
    ... 
    border-top: 1px solid #669999; 
}