Html 以无序列表中的第一个和最后一个锚点为目标'；s列表项

我试图将无序列表的列表项中的第一个和最后一个锚点作为目标：

<ul>
    <li><a href="#">HOME</a></li>
    <li><a href="#">LINK</a></li>
    <li><a href="#">LINK</a></li>
    <li><a href="#">LINK</a></li>
    <li><a href="#">LINK</a></li>
</ul>

---

我需要定位锚，因为我需要删除第一个和最后一个锚的边界。我不能在

上使用（或者至少我认为我不能）边框，因为它需要一些垂直填充，所以分隔符边框不会垂直齐平。
如果您不需要担心旧浏览器，请在列表项上使用
:first child
和
:last child
伪类，如下所示：

/*因为我们正在关注您的
*/
.menu ul li:第一个孩子a{}
.menu ul li:最后一个孩子a{}

但是，现在对CSS3
：last child
的支持非常差，因此更兼容浏览器的替代方法是手动为最后一个列表项指定一个
last
类，如下所示（并对first执行相同的操作）：

您需要和伪类选择器：

<style type="text/css">
.menu ul li:first-child a {
  color: green;
}
.menu ul li:last-child a {
  color: red;
}
</style>

<div class="menu">
  <ul>
    <li><a href="#">apple</a></li>
    <li><a href="#">baker</a></li>
    <li><a href="#">charlie</a></li>
    <li><a href="#">delta</a></li>
  </ul>
</div>


.菜单ul li：第一个孩子a{
颜色：绿色；
}
.菜单ul li：最后一个孩子a{
颜色：红色；
}






我认为您需要的是：first child和：last child选择器

.menu ul li:first-child a
.menu ul li:last-child a

你的HTML是什么？您是否真的声明了
？不，只是
是
.menu
包含
的元素？谢谢，boltclock！请看下面我的回答，我错过了li本身的课程。谢谢，但只有CSS 2，我应该这么说。BoltClock的评论给了我所需要的推动。再次感谢。注意：除了IE 6和IE 7，其他都可以，8+1有点小问题。你赢了我。：）
：first child
和
：last child
选择器实际上是CSS2的一部分。大多数IE版本都缺乏对它们的适当支持（尽管它们在IE9中工作），但其他浏览器应该可以。现在你的工作可能更安全了。@eaj:No，
：最后一个孩子仅是CSS3。我接受更正<代码>：第一个孩子是CSS2，
：最后一个孩子是CSS3。@eaj:我仍然不明白为什么他们没有在CSS2中同时想到这两个：）
<style type="text/css">
.menu ul li:first-child a {
  color: green;
}
.menu ul li:last-child a {
  color: red;
}
</style>

<div class="menu">
  <ul>
    <li><a href="#">apple</a></li>
    <li><a href="#">baker</a></li>
    <li><a href="#">charlie</a></li>
    <li><a href="#">delta</a></li>
  </ul>
</div>

.menu ul li:first-child a
.menu ul li:last-child a