css - 列表的最后一个子伪类不起作用

<分区>

我在列表中使用的 last-child 伪类不起作用。 JSFiddle:http://jsfiddle.net/yuvLk/

HTML:

<ul class="categories">
    Categories
    <li>{category_name}</li>
    <li>{category_name}</li>
    <li>{category_name}</li>
    <li>{category_name}</li>
<ul>

CSS:

ul.categories {
   text-align: center;
}

ul.categories li {
    list-style-type: none;
    background: #E6E6E6;
    width: 250px;
    height: 40px;
}

ul.categories li:first-child{
    -webkit-border-radius: 25px 25px 0 0;
    border-radius: 25px 25px 0 0;
}

ul.categories li:last-child {
    -webkit-border-radius: 0px 0px 32px 32px;
    border-radius: 0px 0px 32px 32px;
}

我用 Google 搜索了一下，在 StackOverflow 上看到了一些询问跨浏览器问题的帖子。我不是在问跨浏览器问题，我使用的是 Chrome v23，last-child 应该可以。

我忽略了什么/做错了什么？

最佳答案

简单的错字:你写了<ul>而不是 </ul> , 所以最后一个<li>并不是最后一个 child 。

更正示例:http://jsfiddle.net/yuvLk/1/

关于css - 列表的最后一个子伪类不起作用，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/14576510/