Weebly：编辑导航栏中的单个元素

Question

我试图编辑导航栏中每个元素的边框顶部，以便我可以为每个元素设置不同的颜色。但是，当我跳入HTML文件时，我只能在导航div中看到“{menu}”。我希望能够识别每个单独的元素，以便我可以设计它。谢谢！

Answer 1

Got it！我用：nth-​​child（）。真棒！

Answer 2

您能否提供一个如何使用nth-child（）编辑Weebly中的单个导航项的示例？

以下是我的Weebly网站的代码，但我无法使其工作。我只是想在导航栏的第一个菜单项左上角四舍五入。现在，当我点击不同的项目时，它会在左上角显示一个圆角。我总是希望左上角保持圆整。我是新手...

#topnav { 
clear: both; 
margin: 70px 0 0 150px; 
-moz-border-radius-topleft: 10px; 
    -webkit-border-top-left-radius: 10px; 
    border-top-left-radius: 10px; 
} 

#topnav ul { 
list-style: none; 
background: #404040; 
width: 504px; 
float: left; 
} 

#topnav li { 
list-style: none; 
display: inline-block; 
margin: 0 auto; 
} 

#topnav a { 
float: left; 
display: block; 
color: #fff; 
background: #404040; 
text-decoration: none; 
font-family: Arial, Helvetica, sans-serif; 
padding: 16px; 
border: 0; 
outline: 0; 
list-style-type: none; 
font-size: 1em; 
text-transform: uppercase; 
font-weight: bold; 
} 

#topnav li#active a { 
color: #fff; 
background: #8fa944; 
} 

#topnav a:hover { 
color: #fff; 
background: #8fa944; 
}