Question

我在列表中使用的最后一个子伪类不起作用。 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;
}

我用谷歌搜索过，看到StackOverflow上的一些帖子询问跨浏览器问题。我不是在询问跨浏览器问题，我使用的是Chrome v23，最后一个孩子应该可以使用。

我在忽视/做错了什么？

Answer 1

简单错字：你写了<ul>而不是</ul>，所以最后<li>并不是最后一个孩子。

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

列表无效的Last-child伪类

1 个答案: