每个元素的保证金除了最后一个

Question

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

这就是我目前（工作）：

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

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

我尝试将其更改为：

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

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

更新我只有五张图片。我的另一个选择是在前四个方面只有利润。

Answer 1

你有小错误

变化：

.work img:not(:last)

到

.work:not(:last-child)

检查Fiddle Here.

Answer 2

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

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

Answer 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，您的浏览器需要支持选择器。

请参阅此参考：http://caniuse.com/#search=%3Alast-child