CSS：取消列表开头和结尾的属性

我有菜单单。我没有使用UL/LI，只是使用嵌套DIV。菜单项之间有图形分隔符。列表中的第一项需要取消左填充；最后一项需要取消右填充和图形分隔符。以下是CSS：

.platformItem {
  float: left;
  padding: 0 12px;
  background: url(/includes/themes/02RWO/images/assets/separator.gif) no-repeat top right;
}
.platformItem .first {
  padding-left: 0 !important;
}
.platformItem .last {
  padding-right: 0 !important;
  background-image: none !important;
}

下面是HTML：

<div id="platformMenu">  
  <div class="platformItem first"><a href="">All</a></div>
  <div class="platformItem"><a href="">Windows</a></div>
  <div class="platformItem"><a href="">Mac</a></div>
  <div class="platformItem"><a href="">Linux</a></div>
  <div class="platformItem last"><a href="">Web</a></div>
  <div class="Clear"></div>
</div>

我希望可以使用修饰符类来抑制某些属性。这可能吗？有更好的方法吗

Thx.

您可以在现代浏览器中使用伪选择器，不过。您还可以查看：

$（文档）.ready（函数（）{

---

毕竟不需要JS。first和.last不是.platformItem的下游，而是从#platformMenu（我应该看到这个）的新代码：

#platformMenu .first {
  padding-left: 0 !important;
}
#platformMenu .last {
  padding-right: 0 !important;
  background-image: none !important;
}

---

是的，在一个理想的世界里，我们只需要处理现代浏览器。对于我们生活的这个谷仓世界，解决方案是什么？是的，那会起作用。但我只是开始这个布局：我希望用CSS来完成它，并且在一段时间内不必求助于JS…使用UL/LI会带来任何好处吗？（顺便说一句，谢谢你的帮助。）UL/LI带来的好处是让您自己和任何维护人员更清楚地知道这些项是一个列表；这是语义的理由。如果您不关心语义，可以将任何块级项放在DIV中，将任何内联项放在span中（这样就更难理解这些元素的含义）。除此之外，CSS可以选择元素，无论它们是LIs还是DIV/DIV。同意John Galloway的观点——内部DIV/list项上的platformItem类是不必要的。为了兼容性，您至少需要“last”类，因为：IE中不支持last child。因此UL/LI的问题是，您需要向st添加一些属性在你得到你想要的之前，撕掉默认的样式。但是我完全支持语义，Val；所以我将保留我刚刚切换到的UL/LI。关于html的一些小细节：（1）这在我看来像一个

，伪装成一堆div（2）您不需要为菜单项指定类，这就是后代选择器的作用：div#platformMenu div{padding:0 12px；etc}乔恩，不要对你的缺点吹毛求疵。很有可能我会改用UL。哦，对了。我还以为你也在试图摆脱.first和.last类。你不需要。首先，如果你的目标是IE7+，你可以使用#platformMeu div:first child。因为在大多数环境中，如果你能控制标记，这是更可靠的赌注。不需要您的！important-s，因为您的特殊性足以覆盖当前声明的特殊性。

#platformMenu .first {
  padding-left: 0 !important;
}
#platformMenu .last {
  padding-right: 0 !important;
  background-image: none !important;
}