除最后一个元素外的每个元素的边距答案

【问题标题】：Margin on every element except last除最后一个元素外的每个元素的边距
【发布时间】：2015-07-28 01:34:33
【问题描述】：

我有 2 行 CSS 用于设置除最后一个元素之外的每个元素的边距。有没有办法把它合并成一行？

这是我目前拥有的（工作）：

.work img {
    margin-right: 10px;
}

.work img:last {
    margin-right: 0px;
}

我尝试将其更改为：

.work img:not(:last) {
    margin-right: 10px;
}

但它不起作用？知道为什么吗？

更新我只有五张图片。我的另一个选择是只在前四个有边距。

【问题讨论】：

你可能想试试 .work img:last-child { margin-right: 0px }
@Quintile 仍在使用 2 行 CSS。我只是想知道我是否可以在一行中完成。我的代码的第一部分正在工作。不是第二部分
原因是没有:last选择器但我们有:last-child和:last-of-type。我正在玩这些选择器，并认为它可能会在未来帮助某人：jsfiddle.net/21rs5dog
@DylanValade api.jquery.com/last-selector 和 :last 当您像 img:last 一样自行测试时工作正常
你说得对， :last 是一个 jQuery 选择器，但你的问题是关于 CSS 的，而 CSS 目前不支持它。

【解决方案1】：

你有一个小错误

变化：

.work img:not(:last)

到

.work:not(:last-child)

【讨论】：

【解决方案2】：

如果您需要完整的浏览器支持，我建议您使用一些 javascript，或者在最后一个 img 上添加一个 .last 类。否则你可以这样做：

.work img:last-child {
  margin: 0;
}

【讨论】：

【解决方案3】：

试试这个：

.work img {
    margin-right: 10px;
}

.work img:last-child {
    margin-right: 0px;
}

或

.work img:not(:last-child) {
    margin-right: 10px;
}

或jQuery解决方案：

jQuery('.work img:not(:last)').css({marginRight: 10);

请记住，如果您应用纯 CSS，您的浏览器需要支持选择器。

【讨论】：