javascript - 同位素砌体布局模式的列特定样式

Question

我有一个砖石布局的同位素画廊:

https://codepen.io/Deka87/pen/owVqmy

JS:

$('.grid').isotope({
    itemSelector: '.grid-item',
    layoutMode: 'masonry'
});

CSS:

.grid-item {
    width: 50%;
}

这基本上将图库分成两列。有没有办法在案例中添加第一列/第二列的特定样式？ IE。我希望第一列中的所有图像都具有绿色边框，而第二列中的图像具有红色边框。提前致谢!

Answer 1

似乎可以使用 CSS 设置第一列元素的样式:

.grid-item[style*="left: 0;"] {
    border-color: green;
}

假定左列项的 left 属性设置为 0。