html - 边框半径不适用于无序列表

Question

我正在尝试在我创建的无序列表中应用边框半径属性。我将使用列表作为导航栏。除边框外，其他 CSS 属性均有效。我正在使用 Microsoft Visual Studio 2008 作为 aspx 文件开发它。我还将其与 Twitter Bootstrap 前端框架一起使用。我对列表所做的是这样的:

#nav, #nav ul{
margin:0;
padding:0;
list-style-type:none;
list-style-position:outside;
position:relative;
line-height:1.5em; 
 z-index: 300;
}
    #nav li:first-child, li:last-child{

        border-radius: 10px;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
    }
#nav a
{
    border-style: none outset none none;
    border-width: 1px;
    border-color: #333;
    display: block;
    padding: 0px 5px;
    color: #fff;
    text-decoration: none;
    background-color: #1B5795;
}

这是我的代码:

<ul id="nav">
<li><a href="#">Menu Item</a></li>
<li><a href="#">Menu Item</a></li>
<li><a href="#">Menu Item</a></li>
<li><a href="#">Menu Item</a></li>
<li><a href="#">Menu Item</a></li>
<li><a href="#">Menu Item</a></li>
</ul>

我是否正在做一些阻止 border-radius 属性工作的事情？

Answer 1

需要对 CSS 做一点改动

    #nav a
{
    border-style: none outset none none;
    border:1px solid #333;
    border-radius: 5px;
    display: block;
    padding: 0px 5px;
    color: #fff;
    text-decoration: none;
    background-color: #1B5795;
}

对我有用