HTML选择问题

我正在我的网站上使用cucumber运行前端测试。目前，我想单击一个div元素，如下所示

<div class=full>
<div class=half>
 <div class=product-image></div>
</div>
<div class=half>
 <div class=product-image></div>
</div>
<div class=half>
 <div class=product-image></div>
</div>
<div class=half>
 <div class=product-image></div>
</div>
</div>

---

我想唯一地选择第一个产品图像类。您能帮忙吗？

您可以这样选择：

.full > div:first-child .product-image{}

---

您可以这样选择它：

.full > div:first-child .product-image{}

试试这个：

.full .half:first-child .product-image{
  ...code
}

试试这个：

.full .half:first-child .product-image{
  ...code
}

---

这就是你想要的吗

。产品图片{
高度：50px；
宽度：100px；
背景色：红色；
保证金：5px；
}
.满.半：第一个孩子.产品形象{
背景颜色：绿色；
}

---

这就是你想要的吗

。产品图片{
高度：50px；
宽度：100px；
背景色：红色；
保证金：5px；
}
.满.半：第一个孩子.产品形象{
背景颜色：绿色；
}